Javascript 创建一个jquery固定动画,而不创建一些重叠动画

Javascript 创建一个jquery固定动画,而不创建一些重叠动画,javascript,jquery,html,Javascript,Jquery,Html,我有这个动画 当我快速浏览这些标签页时,动画会让事情变得非常奇怪 我怎样才能阻止它?我尝试过。停止(真,真),我尝试过创建队列,但我可以让它更干净 此功能在鼠标输入时触发 var becomeBigger = function(element){ deplace(element.index(),function(){ element.dequeue(); element.queue(function(){ $(this).anima

我有这个动画

当我快速浏览这些标签页时,动画会让事情变得非常奇怪

我怎样才能阻止它?我尝试过。停止(真,真),我尝试过创建队列,但我可以让它更干净

此功能在鼠标输入时触发

var becomeBigger = function(element){
    deplace(element.index(),function(){
        element.dequeue();
        element.queue(function(){
            $(this).animate({top: '118px', height: '435px',width: '248px'},settings.timeAnimIn,settings.easingIn,function(){
                $(this).addClass('active');
                deplace(element.index());
            });
            $(this).children('.img').children('.noiretblanc').animate({'opacity':0},settings.timeAnimIn,settings.easingIn);
            $(this).children('.img').children('.couleur').animate({opacity: 1, top: '-321px'},settings.timeAnimIn,settings.easingIn);
            $(this).children('.img').animate({height: '321px'},settings.timeAnimIn,settings.easingIn);
            $(this).children('.titre').animate({height: '57px', width: '228px', backgroundColor: '#4696a7'},settings.timeAnimIn,settings.easingIn);
            $(this).children('.titre').children('h2').animate({fontSize : '22px'},settings.timeAnimIn,settings.easingIn);
            $(this).children('.titre').children('h3').animate({fontSize : '18px'},settings.timeAnimIn,settings.easingIn);
            $(this).children('.btn-verso').css({backgroundPosition : '0 0'});
            $(this).dequeue();
        });
    });

}
还有这个在mouseleave上

var recoverSize = function(element){
    replace(element.index(),function(){
        element.queue(function(){
            $(this).removeClass('active');
            $(this).animate({top: '148px',height: '385px',width: '214px'},settings.timeAnimOut,settings.easingOut);
            $(this).children('.img').children('.noiretblanc').animate({'opacity':1},settings.timeAnimOut,settings.easingOut);
            $(this).children('.img').children('.couleur').animate({opacity: 0, top: '-277px'},settings.timeAnimOut,settings.easingOut);
            $(this).children('.img').animate({height: '277px'},settings.timeAnimOut,settings.easingOut);
            $(this).children('.titre').animate({height: '50px', width: '194px', backgroundColor: '#959595'},settings.timeAnimOut,settings.easingOut);
            $(this).children('.titre').children('h2').animate({fontSize : '20px'},settings.timeAnimOut,settings.easingOut);
            $(this).children('.titre').children('h3').animate({fontSize : '16px'},settings.timeAnimOut,settings.easingOut);
            $(this).children('.btn-verso').css({backgroundPosition : '0 -72px'});
            $(this).dequeue();
        });
    });

}

感谢您的帮助

在开始当前动画之前,您需要停止所有动画,使用jQuery很容易做到这一点:

您可以使用

.stop(false, true).animate(...);
或者是clearQueue()的东西


你需要发布你的问题代码,一个链接只会让你被否决:我试过了,但它不起作用。它会在状态之间停止并创建更奇怪的效果。我需要在每个.animate()函数上放置这个。停止(false,true)?是的,尝试一下。它会停止正在运行的动画,然后启动一个新的动画。但另一点是:代码中有太多的动画调用。我几乎可以肯定,你可以用更少的电话达到预期的效果。