Очистить очередь в jQuery

#javascript #jquery #ajax

#javascript #jquery #ajax

Вопрос:

У меня есть скрипт jQuery, который принимает src-файл img, помещает src в скрытый div и увеличивает изображение с анимацией при наведении курсора мыши на изображение запроса. Однако, когда я перехожу с img на img clearQueue , or stop не работает должным образом.

В этом примере, когда я медленно переключаюсь с img на другой img, все работает нормально, но когда я быстро переключаюсь, img все больше и больше исчезает между img и img.

Все, что я хочу, это иметь возможность быстро или медленно переходить от img к img, и после этого не останется очереди.

Я буду рад, если кто-нибудь сможет мне в этом помочь.

Вот код:

 $(document).ready(function(){
    $(".thumb").hover(function(e) {
        $('#popm').css('left',e.pageX 50);
        $('#popm').css('top', e.pageY 50);
        e.preventDefault();
        var src= $(this).attr("src");
        $('.popimg').attr({"src": src});
        $('#popm').stop().fadeIn(100);
        $('.popimg').stop()
            .animate({
                width: '145px', /* Set new width */
                height: '145px' /* Set new height */
            }, 200);
    }, function() {
        $('#popm').stop().fadeOut(100);
        $('.popimg').stop()
            .animate({          
                width: '45px', /* Set new width */
                height: '45px' /* Set new height */ 
        }, 200);
    });
});  
  

Ответ №1:

Вы, вероятно, хотите сделать .stop(true, true) вместо just .stop() .

В документации для jQuery.stop() четко указано, что stop имеет два параметра, первый из которых является логическим значением для очистки очереди анимации:

.stop( [clearQueue,] [jumpToEnd] )

clearQueue — логическое значение, указывающее, следует ли также удалять анимацию в очереди. По умолчанию используется значение false.

jumpToEnd — логическое значение, указывающее, следует ли немедленно завершить текущую анимацию. По умолчанию используется значение false.