0

いくつかのリストアイテムと、交換されている2つのアイテム間のスライド効果のようなIDがあります。

これは私がこれまでに持っているものです。このアニメーションは最初は機能しますが、その後、最初に移動されたリストアイテムの「top」値は0であり、理由はわかりません。これが理由だと思いますが、確かではありません。また、アニメーションが完了したら位置を通常に戻そうとしましたが、それも機能しませんでした。

listItemPushed<li>上にありlistItem、<li>下にあります

listItemPushed.css('position', 'relative');
listItem.css('position', 'relative');

var top1 = listItemPushed.position().top;
var top2 = listItem.position().top;

listItemPushed.animate({ top: (top2-top1) }, 300);
listItem.animate({ top: (top1 - top2) }, 300, 'linear', function() {
    listItemPushed.before(listItem);
});
4

1 に答える 1

0

animateアイテムのスタイル属性に css を追加していliます。

おそらく、これらの余分なスタイルをクリアする必要があります

これらの値を確認してみてください:

alert(listItem.css('top'));
alert(listItemPushed.css('top'));

プッシュされたオブジェクトを移動した後、おそらくコールバック関数でこれらの css 属性をクリアする必要がありますli

それで

listItemPushed.animate({ top: (top2-top1) }, 300);
listItem.animate({ top: (top1 - top2) }, 300, 'linear', function() {
    listItemPushed.before(listItem);
});

のようなものになります...

listItemPushed.animate({ top: (top2-top1) }, 300);
listItem.animate({ top: (top1 - top2) }, 300, 'linear', function() {
    listItemPushed.before(listItem);

    listItem.css('top', '0');
    listItemPushed.css('top', '0');

});

これについてもう少し考えた後、一番上の要素の高さだけ一番下のオブジェクトを上に移動し、一番下の要素の高さだけ一番上の要素を下に移動する必要があると思います。

jquery の height メソッドを見てみましょう:

listItem.height()
于 2009-11-04T22:59:50.937 に答える