0

これらのステートメントをネストしないようにしています:

$('#capePowerpoint').animate({"right": "+=498px"}, 1000);
$('#capePowerPointContainer').html(capTabArray[capTabCounter][capabilitiesCounter]);
$('#capePowerpoint').animate({"right": "-=996px"}, 0);
$('#capePowerpoint').animate({"right": "+=498px"}, 1000);

.html 行または .animate 行をコメントアウトすると、正しく機能しますが、このように結合しようとすると、div からすべてのコンテンツが削除されます。画面からdivをスクロールして置き換えてから、反対側からスクロールして戻す代わりに。

4

1 に答える 1

3

呼び出しでコールバックメソッドを宣言する必要がありanimateます!

$('#capePowerpoint').animate({"right": "+=498px"}, {duration:1000,complete:function(){
    $('#capePowerPointContainer').html(capTabArray[capTabCounter][capabilitiesCounter]);
    $('#capePowerpoint').animate({"right": "-=996px"}, {duration:0,complete:function(){
        $('#capePowerpoint').animate({"right": "+=498px"}, 1000);
    });
});

詳細:http ://api.jquery.com/animate/

私のようにjQueryメソッドに興味がありすぎる場合はanimate(嫌いです)、GreenSockのTweenLiteライブラリを参照してください。

http://www.greensock.com/v12/

編集:あちこちでクエリを実行するのではなく、要素を保存する必要があります

var cape = $('#capePowerpoint'), container = $('#capePowerPointContainer');
cape.animate({"right": "+=498px"}, {duration:1000,complete:function(){
    container.html(capTabArray[capTabCounter][capabilitiesCounter]);
    cape.animate({"right": "-=996px"}, {duration:0,complete:function(){
        cape.animate({"right": "+=498px"}, 1000);
    });
});
于 2012-09-28T15:24:58.793 に答える