1

基本的に、2 つの jQuery でラップされた要素が$sourceあり、$targetどこ$sourceにシム/プレースホルダーがあります。

$sourceの位置にアニメートしたい$target。アニメーションの後、私はやっています$target.replaceWith($source);

DOM のどこにいても、これを実行できる必要があり$sourceます。$targetこれを達成するためのjQueryプラグイン/簡単な方法はありますか?

私が解決しようとしている問題に関しては、2 つのリストがあり、あるリストの最後の項目を別のリストの先頭にアニメーション化しようとしています。

ここに私の刺し傷があります：

var moveItem = function ($sourceItem, $targetItem, callback, before) {
        var targetCord = $targetItem.css('position', 'absolute').offset();
        $targetItem.css('position', 'static');
        var sourceCord = $sourceItem.position();
        $targetItem[before? 'before': 'after']('<li class="shim"></li>');
        //diag('Shim Created.');
        var $newlyAddedShim = $targetItem[before ? 'prev' : 'next']();

        $sourceItem.css('position', 'absolute')
            .css({ left: sourceCord.left, top: sourceCord.top })
            .animate({ left: targetCord.left, top: targetCord.top }, 'slow', function () {
                $newlyAddedShim.replaceWith($sourceItem.css('position', 'static'));
                callback();
            });
    };

一般的な解決策が不可能な場合、これは私が制約されているマークアップ構造であり、異なる場所にあり$sourceます:$targetliul

div.row > div.col > ul > li
          div.col > ul > li

(隣接する関連リストはそれぞれ独自の div.col にあります。位置は static として継承されます)

私はできるようにしたい： $source.animateTo($target)

4

1 に答える 1

1

jQuery の $.offset 関数を使用 http://api.jquery.com/offset/

var offset = $('#containerToMoveTo').offset();

$('#elementToAnimate').animate({
   top: offset.top,
   left: offset.left
});

そうでない場合は、アニメーション化する直前に #elementToAnimate の絶対位置を指定してみてください。

$('#elementToAnimate').css('position', 'absolute');
于 2013-07-10T15:56:11.023 に答える