jquery - .hover() 函数。重置动画

Question

我的问题是我正在使用 jquery 函数'.hover()'，如果我将鼠标缓慢移动到 div 上，它可以正常工作。当我调高并开始快速移动鼠标指针时，动画不会停止，甚至更糟！一切都开始在页面周围移动，而不会重置到其初始位置。

代码位：

$('.popProdContainer').hover(function(e){
             $(this).find('.pdtprice').stop().animate({"left": "-=70px"}, "slow");
             $(this).find('.pdtcartBkt, .pdtcartAdd').show('slow');
         },function(e){
             $(this).find('.pdtprice').stop().animate({"left": "+=70px"}, "slow");
             $(this).find('.pdtcartBkt, .pdtcartAdd').hide('slow');
});

所以，这就是我所拥有的。试图把 .animate 放在后面：

.filter(':not(:animated)') 

没用。

Answer 1

解决了这个问题。

我希望这对其他人有所帮助：

$('.popProdContainer').bind('mouseenter',function(){
    $('.pdtprice', this).animate({
        marginLeft: "-0.6in"
    },500);

    $('.pdtcartBkt', this).fadeIn('fast');
    $('.pdtcartAdd', this).fadeIn('fast');
}).bind('mouseleave',function(){
    $('.pdtprice', this).animate({
        marginLeft: "0.6in"
    },500);

    $('.pdtcartBkt', this).fadeOut('fast');
    $('.pdtcartAdd', this).fadeOut('fast');
});