Беда у меня вот в чем:
- Cовсем запутался с toggle. Как видно из кода, срабатывает при клике через раз.
- toggle, который переключает текст на картинку во время гет запроса, с каждым кликом на новое поле срабатывает больше на 1 раз (т.е. должен сработать один раз при одном клике, а срабатывает при каждом клике на новое поле на 1 раз больше).
В каждом из блоков <div class="raiting_blank">,<div class="raiting_hover"> и <div class="raiting_votes"> содержаться картинки звезд (в бэкграунде). Блоки наложенны друг на друга.
Запихал все в один hover обработчик для того, чтобы была возможность проверить каждый на куки. Хотелось бы конечно проверять в цикле который расставляет начальное положение звездочек. Если подскажите как буду очень благодарен.
Собственно js код:
// div.raiting_votes - текущая оценка
// div.raiting_hover - звездочки при наведении при наведении
// div.block - блок в котором находится изображение и рейтинг звездочки
// в его атрибут id динамически присваивается занчение вида img_1 в котором
// цивра с четвертой строки указывает на id изображения в бд
//Цикл в котором расставляются звездочки
$('.block').each(function(){
var total_reiting =parseInt($(this).find('.raiting_info').text());
var star_widht = total_reiting*16 + Math.ceil(total_reiting);
$(this).find('.raiting_votes').width(star_widht);
var id = $(this).attr('id');
var id_arc = id.substr(4);
});
$('.raiting').hover(function()
{
$(this).find('.raiting_votes, .raiting_hover').toggle();
$(this).mousemove(function(e){
var margin_doc = $(this).offset();
var widht_votes = e.pageX - margin_doc.left;
user_votes = Math.ceil(widht_votes/17);
$(this).find('.raiting_hover').width(user_votes*17)
});
$('.raiting').click(function(){
$(this).parents('.raiting_star').find('.raiting_info p, .raiting_info img').toggle();
var id = $(this).parents('.block').attr('id');
var id_arc = id.substr(4);
var reiting = $(this).parents('.raiting_star').text();
reiting = parseInt(reiting);
$(this).parents('.raiting_star').find('.raiting_votes, .raiting_hover').toggle();
$(this).unbind();
$.cookies.set('img_'+id_arc, 'voice');
$.get(
"raiting.php", {id_arc: id_arc, user_votes: user_votes},
function(data)
{
var obj = eval('('+data+')');
var path ='#img_'+id_arc+' .raiting_star';
$(path).find(".raiting_info p").html(obj.new_ratio+' / '+obj.num_rat);
$(path).find('.raiting_info img, .raiting_info p').toggle();
$(path).find('div.raiting_votes').width((obj.new_ratio)*17);
}
)
});
},
function()
{
$(this).find('.raiting_votes, .raiting_hover').toggle();
});
Код html:
<div class="raiting_star">
<div class="raiting">
<div class="raiting_blank"></div>
<div class="raiting_hover"></div>
<div class="raiting_votes"></div>
</div>
<div class="raiting_info"><img src="load.gif" alt="load"/><p>'.$myrow["ratio"].' / '.$myrow["num_rat"].'</p></div>
</div>
Помогите пожалуйста исправить код. Заранее благодарен.