0

Имеется функция формирования чисел из картинок:

function setCounterToNumber(index, num, container)
{
    var nums = [1,1,1,1,1,1,1,1,1,1,1,1,1,1];
    $('.'+container+' #counter > div:eq('+index+')').stop();
    for(i=0; i <= num; i++)
    {
        $('.'+container+' #counter > div:eq('+index+')').children('.top').delay(100).animate({height:'0px'},100,function()
        {
            if(nums[index]+1 > 10) next_num = 1; else next_num = nums[index]+1;

            $(this).attr('src','/digits/'+nums[index]+'.png').css('height','19px').prev().attr('src','/digits/'+(next_num) +'.png');

            $('.'+container+' #counter > div:eq('+index+')').children('.bottom_high').animate({height:'19px'},100,function()
            {
                $(this).attr('src','/digits/'+(next_num)+'-d.png').css('height','0px').prev().attr('src','/digits/'+(nums[index]) +'-d.png');
                nums[index]++;
            });
        });
    }
}

+имеется обработчик mouseenter, если наводим курсор на определенный div (их несколько), то запускается формирование этих изображений. Проблема заключается в следующем: когда быстро водить курсором сразу по нескольким div'ам, то получается, что цифры будут формироваться ровно столько, сколько раз я провел курсором по этим div'aм.

Нужно, чтобы при наводке курсора на div, цикл сбрасывался и начинался заново. Как это можно реализовать?

1 ответ 1

3

А давайте глянем с другой стороны: раз нам не нужен просчет при наведении на каждый блок, то не лучше ли добавить таймер, который бы запускал скрипт просчета через n количество времени и который бы очищался при следующем наведении мыши на блок?

Т.е.:

var timer;

$('img').on('mouseenter', function() {
   clearTimeout(timer);

   timer = setTimeout(function() {

      setCounterToNumber();

   }, 100); // 100ms
});
2
  • Нужно чтобы формирование этих картинок останавливалось при наведении на друой div и начиналось заного. К сожалению, вариант что предложили вы - не совсем подходит. Хотел скинуть код обработчика, но символов в комментарии не хватает.
    – roman_r
    15 апр 2013 в 13:47
  • @roman_r тогда добавьте ключ в цикл, который будет его прерывать: var keyForWhile = false; $('img').on('mouseenter', function() { keyForWhile = true; setCounterToNumber(); }); function setCounterToNumber(index, num, container) { keyForWhile = false; if(keyForWhile) { break; } ... }
    – lampa
    15 апр 2013 в 14:08

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.