問題タブ [draggable]

領域にタグを追加する際に問題があります。IDを変更した後、 #Normal_Tag1_div のクローンを #droppable に追加しようとしています。また、そのクローンを #droppable only でドラッグ可能にしたいと考えています。どうやってやるの？？

別の空の < ul > 要素にドラッグできる < li > 要素のドラッグ可能なリストがあります。ドラッグ可能な元の < ul > の最初の < li > 要素をドラッグすると、すべて正常に動作します...

問題：

...しかし、そのリストの他の < li > 要素をドラッグすると、受信しているソート可能な < ul > の境界を越えるとすぐに、「ヘルパー」がマウス ポインターから離れます。より正確には、リストの一番上に移動します。

誰もこれを見て、解決策を知っていますか? まあ、私の問題は、私はjqueryを使用しているだけで、あまり深くは使用しておらず、javascriptを深く使用したこともありません。

問題に関する詳細情報:

私のjQueryコード:

#roleList と #roleDrop は前述の順序付けられていないリストですが、#container はテーブルです。

今何が起こるかのスクリーンショット。

アイテムのドラッグを開始します。

http://drop.io/download/public/dkabw5hlq3yfm0f84yji/7bf91122adc241373a5da13b5bde4b231644c1c5/da142000-ff76-012b-41ee-f10bc9db08a6/5a1bfa70-68f6-012c-6d08-f206umav3/f206umav3/ラージ

2 番目の <ul> の境界を越えると、ヘルパーがジャンプします。

http://drop.io/download/public/dkabw5hlq3yfm0f84yji/2fad1d633d38cf593da46c638d1930431ea5fd35/da142000-ff76-012b-41ee-f10bc9db08a6/5c65c4c0-68f6-012c-6601-f12dum7d/大規模な

xhtml マークアップも必要な場合はお知らせください。

画面を 2 つに分割しましDIVた。左側DIVには 50x50 ピクセルDIVの s がいくつかあり、右側DIVには 80x80 s で作られた空のグリッドがありますLI。DIV左側の はドラッグ可能で、 にドロップすると、そのLIの中心にスナップする必要がありLIます。

シンプルですね。私はこれを成し遂げる方法を知りません。ドロップされたとCSS プロパティを操作して、それらDIVがドロップされたものと一致するようにしましたが、とプロパティは left に対して相対的です。topleftLIlefttopDIV

ドロップされた要素をドロップ先の要素の中心にスナップさせるにはどうすればよいですか? それは簡単なことですよね？

編集: jQuery 1.3.2 で jQuery UI 1.7.2 を使用しています。

編集2:この問題を抱えている他の人のために、これは私がそれを修正した方法です:

dropドラッグされた要素を削除し、ドロップ可能なプラグインのコールバックでドロップされた要素内に配置するという Keith のソリューションを使用しました。

ドロップされた要素を再びドラッグ可能にすることはありませんが、そうする場合は、ドラッグ可能な要素を再度バインドするだけです。

私にとって、この方法は、ドロップされた要素を配置するときに発生した問題も解決しました (これは left に対して相対的ですDIV) DIV。(要素はページ上で固定されたままになりますが、スクロールするようになりました)。

ドラッグ中に見栄えを良くするためにスナップオプションをいじったので、その提案についてkarim79に感謝します。

これで素晴らしいコードの賞品を獲得することはおそらくないので、改善の余地がある場合は共有してください!

人々が Scriptaculous に追加したものを調べていたときに興味深いコードを見つけたので、自分の目的に合わせて修正しようとしています。ドロップ ハンドラー コードを貼り付けると、ページの読み込みが停止することを除いて、ほぼすべてが機能しました。

関連するスニペットは次のとおりです。

ドラッグ可能の場合:

ドロッパブルの場合:

ドロップハンドラー:

コードを「alert()」に置き換えたところ、正常に機能し始めたので、最後のブロックの何かがうまく機能していません。現在のバージョンの scriptaculous で動作するように、多くのコードを変更する必要がありましたが、私はそれほど詳しくないので、古いコードと関係があるのでしょうか? または、私が見るのに十分ではない何かが間違っている可能性があります.

Canvas 要素を使用して、ある要素から別の要素に線を引きます 別の要素はドラッグ可能で、要素をドラッグすると、線はドラッグ可能な要素に従います。

私の問題は、レンダリングが遅いことです (Mac PowerBook では Fx 3.5)。以前に Canvas ではるかに優れたパフォーマンスを見たことがあると思います。

キャンバスの経験があり、パフォーマンスのヒントを教えてくれる人はいますか?

前もって感謝します

次のメソッドは、ドラッグ イベントで呼び出されます。

}

ヒントをありがとう、

よろしくエリック

cssを使用してoverflow:hiddenに設定された別の要素内の「コンベア」要素に要素のグループがあります。ドラッグするときに、オーバーフローが非表示に設定されているホルダー要素から要素を「外に」取得するにはどうすればよいですか? 「アイテム」に分類された画像をドラッグすると、ホルダー内でのみドラッグされ、ホルダーの「外側」に移動しようとすると、非表示になり、古いホルダー要素の外に移動しません。

また、新しく移動した要素を親要素に追加しようとしましたが、アイテムがホルダーに戻りません....助けてください!

アイテムを追加しようとしました:

Drag イベントを通過するのではなく、これを行う簡単な方法 (プロパティまたは ListView の何かを設定する) があるかどうか疑問に思っていました。

私が欲しいのは、ユーザーが ListView 内で ListViewItems をドラッグし、ドロップすると、ユーザーが残した場所に残る Windows エクスプローラーと同様の機能です。私が知りたいのは、このような機能がリスト ビューに組み込まれているかどうかだけですか? そうでない場合は、ドラッグイベントでそれを行う必要がありますが、必要がない場合は不要な作業をしたくありません!

ありがとう、

更新
私が持っていた回答はすべて、ドラッグドロップ機能を含むサンプルプロジェクトを使用しているように見えました.回答に感謝しますが、これを行う方法はすでに理解しています. この質問は、ListViewItems の内部ドラッグに利用できる ListView の組み込み機能があるかどうかを目的としています。

jQuery UI のドラッグ可能なものと、個別に定義されたいくつかのdroppablesがあります。ドロップ可能オブジェクトの 1 つが構成tolerance: 'intersect'されているため、ドラッグ可能オブジェクトが複数の種類のドロップ可能オブジェクトに同時にドロップされる可能性があります。

意図しないドロップ可能アイテムが発射されるのを防ぐ最善の方法は何ですか? tolerance: 'intersect'基本的に、別のドロップ可能がトリガーされた場合にドロップ可能がトリガーされないように、ドロップ可能を優先したいと思います。

更新- 物事を明確にするための詳細情報:

• tolerance: 'pointer'ドロップ可能の 1 つのクラスを除いて、すべてのドロップ可能が構成されますtolerance: 'intersect'。

• ドロップ可能の 1 つのクラスが存在する理由tolerance: 'intersect'は、ドロップ可能が非常に狭く、ユーザーが でそれらを見つけるのに問題があるためtolerance: 'pointer'です。

• ドロップ可能なものをさらに離すことはオプションではありません。

• ドロップ可能なものはどれもオーバーラップしませんが、ドラッグ可能なものはtolerance: 'intersect'、マウス ポインターが のある別のドロップ可能なものの上にある間に、ドロップ可能なものとオーバーラップするのに十分な大きさtolerance: 'pointer'です。この方法では、最大 2 つのドロップ可能オブジェクトを一度にトリガーできます。

• tolerance: 'intersect'UI は、別のドロップ可能オブジェクトがトリガーされた場合にドロップ可能オブジェクトを無視することで、ユーザーの意図を判断できるようにレイアウトされています。つまり、ユーザーがマウス ポインターを でドロップ可能な上に移動した場合、tolerance: 'pointer'そこにドロップするつもりであると想定しても安全です。問題は、不要なドロップ可能ファイルを無視する方法がわかりません。

Google でホストされている最新の jQuery/UI を使用します。次のマークアップがあります。

そして、次のJavaScript：

});

最初のものを 2 番目の上にドラッグするliと、mousemove 関数が起動します (そして、firebug が出力をログに記録します)。しかし、2 番目を最初の上にドラッグするliと、mousemove 関数は起動しません。これはライブで見ることができますhttp://jsbin.com/ivala。これには理由がありますか？他の方法で mousemove イベントをトラップする必要がありますか?

編集: mousemove() イベントは、現在ドラッグされている要素より前の要素にバインドされていないようです (マウスオーバー時にバインドする必要があります)。

私はイメージ パン ツールを開発しており、親切なメンバーが jQuery のドラッグ可能なプラグインを教えてくれた後、ほとんどの作業を完了しました。現在、ユーザーが画像 (約 300px x 300px の div 内に含まれる) をドラッグすると、画像は最初にちらつき、次にパンします。この問題は、マウス ダウン イベントの後、マウス移動イベントで発生するようです。マウスを動かすと画像が 4 つのコーナーの 1 つに移動し、特定の領域に移動すると別の移動が発生します。私はグーグルで何も見つけることができませんでした。私はまだjQueryに比較的慣れていません。

説明が曖昧すぎる場合に備えて、ここにコードをアップロードしました: http://www.studentgroups.ucla.edu/csa/test/zoom.htm

どんなアイデアやアドバイスも大歓迎です！