我制作了一个简单的鼠标进入和鼠标离开动画。当你鼠标进入div。比链接 div 要打开。当您将鼠标移开时,div 将关闭。我用 slideUp 和 slideDown 设置了一个动画。
我对动画有疑问。页面上有很多.comment div。当我快速将鼠标悬停在项目上时。幻灯片动画快疯了,你会看到很多次动画。我该如何解决?谢谢!
$("#comments .comment .links").hide();
$("#comments .comment").mouseenter(function() {
$(".links",this).slideDown(300);
}).mouseleave(function() {
$(".links",this).slideUp(300);
});
最佳答案
使用stop(true)
清除每个事件的动画队列:
$("#comments .comment .links").hide();
$("#comments .comment").mouseenter(function() {
$(".links",this).stop(true).slideDown(300);
}).mouseleave(function() {
$(".links",this).stop(true).slideUp(300);
});
此外,您可以使用 hover()
来压缩此代码:
$("#comments .comment .links").hide();
$("#comments .comment").hover(
function() { $(".links", this).stop(true).slideDown(300); },
function() { $(".links", this).stop(true).slideUp(300); }
);
关于javascript - Mouseenter 和 mouseleave 动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10513340/