jquery動畫div上的多個點擊事件

我想要實現的動畫效果是直到下一次點擊時它應該停止並等待另一次點擊再次開始動畫。jquery動畫div上的多個點擊事件

這是功能動畫我的div：

function upAndDown(element,x) { 

    $(element).animate({'top':'+='+x+'px'}, 'slow') 
    .animate({'top':'-='+x+'px'}, 'slow',function(){upAndDown(element,x)}); 
}; 

$('.clickThis').click(function(){ 
    upAndDown('.moveThis',50); 
});

我真的不知道如何得到我想要的東西！

感謝

來源

2012-03-27 luca

這其實是有點棘手，因爲你有多個排隊動畫和回調。

問題是如果你只是stop，然後在以後打電話upAndDown，你將從當前位置開始動畫，這意味着你可能偶爾在頁面上移動。在stop()呼叫中您也不能撥打jumpToEnd，因爲您仍然會撥打回撥電話。

我通過添加一個類moving來解決這個問題，當（恰當地）移動對象時。這用於回調來決定是否保持動畫。

你結束了這一點：現在

http://jsfiddle.net/EkpNK/

，這一直動畫，直到它完成一個週期。如果你想擁有它立即停止，你可以調用.stop(false, true)兩次，同時停止動畫，並返回到原來的點：

http://jsfiddle.net/EkpNK/1/

如果你想停止的地方，從你離開的地方繼續下去，將需要一些額外的代碼。

來源

2012-03-27 23:42:41

我的解決方法是非常相似的傑夫B的，而是讓事情（IMO）乾淨了一點，並使用jQuery.data（）函數來存放「動畫」的標誌，而不是添加/刪除類：

http://jsfiddle.net/HnK98/

來源

2012-03-27 23:51:31

jquery動畫div上的多個點擊事件

回答

相關問題