jQuery动画延迟不起作用

当用户悬停时，我正在为一个div制作动画，只是想要一点延迟，但它似乎没有增加延迟，是否有什么我做错了？jQuery动画延迟不起作用

$(".carousel-desc").mouseenter(function() { 
    $(this).delay(1000).animate({ 'height': '180px' }, { queue: false, duration: 600 }); 
}); 

$(".carousel-desc").mouseleave(function() { 
    $(this).delay(1000).animate({ 'height': '40px' }, { queue: false, duration: 600 }); 
});

感谢，J.

来源

2011-09-23 JBoom

我认为这个问题是queue: false; Usally动画得到排队，但你马上让动画功能动画。为你的东西

$("#element").mouseEnter(function(){ 
    $("#element").clearQueue(); 
    //other stuff 
}

：

这也许会做什么，你propably需要

$(".carousel-desc").mouseenter(function() { 
    $(this).clearQueue(); 
    $(this).delay(1000).animate({ 'height': '180px' }, { duration: 600 }); 
}); 

$(".carousel-desc").mouseleave(function() { 
    $(this).clearQueue(); 
    $(this).delay(1000).animate({ 'height': '40px' }, { duration: 600 }); 
});

来源

2011-09-23 10:31:11 Snicksie

好吧，我的代码确实工作，如果我把'队列'出来，但延迟不起作用，如果我添加您的代码与队列：虚假在那里。 – JBoom

对不起，忘了删除队列：false :)将更改 – Snicksie

感谢Snicksie，现在所有的工作都很棒 – JBoom

.delay()，因为你把queue: false在动画选项延迟动画队列

，它立即执行。

这样使用它，它会被固定

$(".carousel-desc").mouseenter(function() { 
    $(this).delay(1000).animate({ 'height': '180px' }, { duration: 600 }); 
}); 

$(".carousel-desc").mouseleave(function() { 
    $(this).delay(1000).animate({ 'height': '40px' }, { duration: 600 }); 
});

工作示例： http://jsfiddle.net/hxfGg/

来源

2011-09-23 10:38:12 Sander

但现在它排队动画，所以如果人们将鼠标悬停和放出几次，动画 – JBoom

我Snicksie同意，但是，对于当前的代码的情况下，有一个更好的方法：

$('.carousel-desc').hover(function() { 
    $(this).delay(1000).animate({ 
     'height': '180px' 
    }, 600); 
}, function() { 
    $(this).delay(1000).animate({ 
     'height': '40px' 
    }, 600); 
});

^{[View output]}

来源

2011-09-23 10:43:03

jQuery动画延迟不起作用

回答

相关问题