jquery animate - 如果另一个动画开始,停止动画整理

时间:2012-07-15 21:40:30

标签: jquery

任何人都可以帮助我更好地理解动画。

我想知道是否有可能在跑步时停止当前的动画位置。然后从另一个动画函数,将它从当前位置传递到新位置。

尝试解释这个很难,所以我创建了一个fiddle ...


Fiddle

http://jsfiddle.net/motocomdigital/L5uh4/9/

在小提琴中,你会看到一条推文。如果您只是翻阅推文,它将为左侧定位设置动画,将整条推文带入视野。

但是,如果您推出推文,它会重新开始动画。

注意:如果推文比可见的推特区域短,动画将不会运行。如果发生这种情况,请将小提琴窗口缩小到大致下面的大小并重新运行fiddle

enter image description here


我的问题

如果我连续10次将这些推文上下移动。它希望在队列中一个接一个地运行所有10个动画交替。

我不希望这种情况发生,我需要它,所以如果我将鼠标悬停在推文上 - 动画开始,但如果我徘徊在OFF(动画完成之前),我希望暂停它的当前位置和动画到悬停OFF位置。而不是堆叠队列。但这也可以反过来吗?

这有一个简单的方法吗?感谢


查看我的代码

$("#tweet").tweet({

    username: ["seaofclouds", "laughingsquid"],
    count: 1,
    template: "{text}",
    avatar_size: 32

}).bind("loaded", function(){

    var visible = $('#tweet ul').width(),
        spanTweet = $('span.tweet_text').width();  

    if ( spanTweet > visible ) {

        $('#tweet ul').hover(function() {

            $('#tweet ul li').animate({            
                left : '-' + ( spanTweet - visible ) + 'px'              
            }, 3000 );

        }, function() {

            $('#tweet ul li').animate({              
                left : '0px'              
            }, 3000 );

        });

    }

});


提前感谢您对此的任何帮助:)

1 个答案:

答案 0 :(得分:4)

关于.stop的另一个问题。

$('#tweet ul li').stop().animate( ... );

我希望this fiddle是你想要的。