複数のドラッグ可能な要素があり、それらを互いに重ねてドロップしたくありません。ドラッグした要素をドラッグしたときに薄緑色で表示したいのですが、特定のクラスの要素を超えると、赤色に変わります。ドロップすると元の位置に戻ります。
他のすべては単純ですが、別の要素に「入る」ためのイベントが必要になります。
問題を解決するための統合関数やプラグインが見つかりません。
すべての要素の位置とサイズを記録し、ドラッグイベントでそれらと比較する以外に、これを自分で行う方法は考えられません。しかし、それはとても重いので、ドラッグは苦痛になります。
それで、何か提案はありますか？おそらく私が見つけていないプラグイン？:)
プラグインが必要だとは思えません。バニラjQueryUIを使用してすでに処理できるものとは異なるドラッグアンドドロップ動作については説明していません。
私の理解では、共通の目的を共有するドラッグ可能オブジェクトがたくさんありますが、それらのドロップ可能オブジェクトは、ドラッグされたものに応じて変更する必要があります。必要なのは、ドラッグ可能なオブジェクトの開始イベントにフックして、操作するドロップ可能なオブジェクトの受け入れオプションを条件付きで変更することだけです。
自分で簡単なテストを実行すると、jQuery UIがドロップ可能の上にある場合はドラッグ可能なヘルパーにCSSクラスを挿入しないようです。したがって、ドロップ可能な上にあるときにヘルパーの色を変更するために純粋なCSSを使用することはできません。
ただし、draggableのdragメソッドにフックして、それがどの要素を超えているかを常に監視する代わりに、droppableのoverおよびoutメソッドを使用して、draggable-helperにクラスを追加および削除できます。ドラッグスタートでacceptオプションを設定するので（前に説明したように）、 overメソッドは、ヘルパーの色を変更する要素に対してのみ呼び出されます。
申し訳ありませんが、コード例は投稿していませんが、説明がお役に立てば幸いです。