これは私のために働いていません...
$(document).ready(function(){
$('#h .a').animate({
top:'-=80px'
},90,'linear');
$('#h .au,#h .di').animate({
left:'-=80px'
},50000000,'linear');
$('#h .r').animate({
left:'-=80px'
},250,'linear');
$("#h").animate('pause'); //pausing it at the start
//resume pause switch
$("#h").mouseover(function(){
$(this).animate('resume');
}).mouseout(function(){
$(this).animate('pause');
});
});
ここでデモをチェックしてください: http://api.jquery.com/clearQueue/
まさにあなたがやろうとしているようなことのように見えます。
一時停止と再開のためにこれを試してください: jQuery一時停止/再開アニメーションプラグイン
また、$(this).stop()
はアニメーションを一時停止できますが、再開することはできません。
他の間違いはこれです:top:'-=80px'
最初にこのように現在の位置を取得してから、それに位置を追加してみてください。
_top = $(this).offset().top;
$('#h .a').animate({
top:_top-80
},90,'linear')
プラグインを確認してください:Fxqueues
https://github.com/lucianopanaro/jQuery-FxQueues
(キューをクリアせずに)一時停止と再開の両方をサポートし、スコープの概念を追加します。スコープは、複数のオブジェクト間でアニメーションをチェーンするのに最適です。
現在のバージョンのJquery用のFxqueusのバージョンは見つかりませんでしたが、古いバージョンのJqueryで正常に使用できました。
これには.stop()
関数の使用を検討する必要があります。これは、jQuery要素のアニメーションをすべて停止するためです。
queue() および dequeue() 関数を使用します。これは、jQueryのドキュメントから直接引用した例です。