1

背景：私はドラッグ可能なものの中にドロップするドラッグ可能なものを持っています。「ドロップ」では、ドラッグ可能はドロップ可能内にネストされます。'out'（つまり、ドラッグ可能オブジェクトをドロップ可能オブジェクトの外側にドラッグ）すると、ドラッグ可能オブジェクトはネストされなくなります。つまり、本体にネストされます。

問題：ドラッグ可能オブジェクトのネストとネスト解除により、ドラッグ可能オブジェクトの位置が新しい位置にスナップします。これは、ドラッグ可能なcssに前の親に対する相対位置が含まれており、新しい親にネストするプロセスでは、この相対cssが新しい親を基準にしていると見なされるためです。

例と問題：http：//jsfiddle.net/sandeepy02/CNtRX/2/の例次の方法で問題 を再現できます。

  1. オブジェクト「部屋」と「テーブル」を作成します。

  2. 「部屋」を移動します。

  3. 「テーブル」を「ルーム」にドロップします。

テーブルはマウスカーソルから離れた位置に再配置されます。これが発生する理由は、「table」のcssに、メインのboundaryContainerに対するテーブルの位置が含まれているためです。「テーブル」を「部屋」にドロップしてネストすると、「部屋」に対して同じ相対位置が適用されるため、「テーブル」の位置が突然変更されます。

実際、「テーブル」をドラッグすると、位置は再び別の位置にスナップします。これは、「テーブル」cssに「部屋」への相対位置が含まれ、「テーブル」を「境界コンテナ」に追加すると、相対位置が「部屋」になるためです。 'boundaryContainer'に対する相対位置として想定されます。

どんな助けでもありがたいです。

4

3 に答える 3

1

問題は、Table Div-> left＆に追加される2つの追加のパラメーターにありますtop。私が提案する回避策は、ドラッグ可能またはドロップ可能なイベントごとに関数を呼び出すオプションがあります。その関数では、これら2つの属性の値を0に設定できます。

Firebugを使用してそれらを削除したとき、位置は完全に整列していました。試して結果をここに投稿できますか？

于 2012-07-30T06:07:49.817 に答える
0

アフリン、返事ありがとう。私は同じ解決策をあきらめ、先週の応答のチェックをやめました。しかし、あなたの反応はトンネルの終わりの光のようです。

私はuが提案したものから、左右がゼロではなく、ドラッグ可能な左とドロップ可能な左の合計になるようにコードを変更しました。

ドロップ可能なものの中にドラッグ可能なものをドロップしているときに動作するようです。ただし、ドラッグ可能なものをドロップ可能なものの外側にドラッグすると、同じことが機能しません。ドラッグ可能な位置はまだジャンプします。

同じコードはhttp://jsfiddle.net/sandeepy02/CNtRX/3/にあります

divの位置も確認できるように、少し変更を加えました。

位置を変更するコードは次のとおりです。

        ui.draggable.css({
            "left": positionDrag.left - $(this).offset().left,
            "top": positionDrag.top - $(this).offset().top
        });
于 2012-08-10T08:14:27.737 に答える
0

私はこのように解決しました

jquery_ui.jsで_mouseDrag： partを見つけました

this.helper[ 0 ].style.left = this.position.left - new_el_pos + "px";
this.helper[ 0 ].style.top = this.position.top - new_el_pos + "px";

elemenが作成されたときに、要素の最初の位置に等しいnew_el_pos変数を追加しました。したがって、ドラッグするたびに、オブジェクトのcssが修正されます。

私がインターネットで見つけた他の解決策はありません。

于 2022-02-10T07:07:49.707 に答える