-1

<div>この関数を使用して、一連の をアニメーション化しようと.animateしています:

slideOut: function(container){
    var count = container.siblings().size() - 1;
    container.siblings().each(function(index, item){
        $(item).delay( index * 50 ).animate({ "left" : "-1000px" }, "fast", function(){
            if (index == count){
                container.delay(container.parent().parent().children().size() > 10 ? 10 * 50 + 300 : container.parent().parent().children().size() * 50 + 300  ).animate({ "left":"-1000px" }, "fast", function(){
                    container.parent().parent().clone(true, true).appendTo(metro.tiles);
                    metro.overlay(container.parent().parent().parent());
                }); 
            }       
        });
    });

},

そして、次の関数を使用してそれらを DOM に戻しています。

slideInTiles: function(){
    $("#contentWrapper").empty();
    $("#contentWrapper").append(metro.tiles.children());

    $("#contentWrapper li").animate({"left": "0px"}, "fast");
    $("#contentWrapper li.activeTile").css({"left": "0px"}, "fast");
},

ただし、問題は、<li>クリックしたものがアニメーション化されてミックスに戻らないことです。私は.cssそれを取り戻すために使わなければなりません。この問題を引き起こしているコードのバグはどこにありますか? また、アクティブliを使用して元に戻す.cssので、ビューからアニメーション化することもありません。これはメソッドに関係していると確信してい.cloneます。しかし、どうやって、私は理解できません。

4

2 に答える 2

1

適切な例やより関連性の高いコードがないとわかりにくいですが、おそらくあなたの問題はここにあると思います：

container.delay(container.parent().parent().children().size() > 10 ? 10 * 50 + 300 : container.parent().parent().children().size() * 50 + 300).animate({

delay()キューでのみ機能し、キューを開始する前に使用しています。container.parent().parent().children().size()次に、 ...よりも優れたセレクターが必要です。
また、lengthの代わりに使用することもできますsize()。size()を返す単なるショートカットですlength。最後に、これらすべてのセレクターをキャッシュして、アプリの実行速度を少し速くします。$("#contentWrapper")キャッシュできます。

于 2012-04-18T20:54:07.710 に答える
0

まず、問題がいつ始まるかがわかるように、一歩下がって現在の場所から単純化し、段階的に進むことをお勧めします。問題がピクセルの使用に起因する可能性があることを示すこのフィドルを見てください。代わりにパーセントを使用する必要があります：http：//jsfiddle.net/UVPYW/1/それを超えて、遅延についての@elclanrsの回答に注意を払うようにしてください。また、画面から削除したい元の要素を削除または複製していないことも確認してください。コードでは、最初にアニメーション化された#contentWrapper内の要素を実際に削除しているように見えます。これにより、再度アニメーション化しようとすると問題が発生します。画面上で新しい要素をアニメーション化する場合は、最初に負の値になるようにcssで設定してください。したがって、元々-1000の左になるように設定し、アニメーション化するときは、画面に表示される左の値になるようにしてください。

于 2012-04-18T21:26:23.057 に答える