Question

我的脚本存在问题。动画一直在排队。我在你的论坛上搜索了解决方案。我尝试停止（true，true）及其中的一些变体以及queue：false。

也许我只是把它放在了错误的位置，我对jQuery的态度还不是100％。

此功能目前看起来像这样;

jQuery(document).ready(function($) {
    $('div.wp-caption').each(function(i) {

        var img_ = $('img', this);          
        var img_height = img_.attr('height');
        var p_height = $('p', this).outerHeight();

        $(this).height(img_height);

        $(this).hover(function()  { 
            img_.animate({marginTop : -p_height}, 500);
        },  function()  {
            img_.animate({marginTop : '0'}, 500);
        });                 
    });     
});

Answer 1

如果你把它放在stop()方法之前，

.animate()应该可以正常工作：

$(this).hover(function()  { 
    img_.stop().animate({marginTop : -p_height}, 500);
},  function()  {
    img_.stop().animate({marginTop : '0'}, 500);
});

Answer 2

尝试清除动画队列：

            $(this).hover(function()  { 
                img_.stop(true, true).animate({marginTop : -p_height}, 500);
            },  function()  {
                img_.stop(true, true).animate({marginTop : '0'}, 500);
            });

true, true参数告诉jQuery清除队列并跳转到动画的末尾。

Answer 3

尝试将.stop()放在.animate

之前

$(this).hover(function()  { 
   img_.stop().animate({marginTop : -p_height}, 500);
},  function()  {
   img_.stop().animate({marginTop : '0'}, 500);
});

Jquery动画队列问题

3 个答案: