Comment utiliser jquery draggable pour empêcher les éléments d'être glissés les uns sur les autres

Question

Je crée une interface utilisateur en utilisant jquery où plusieurs éléments peuvent être déplacés dans une div "surface". Je ne veux pas laisser se chevaucher l'un d'entre eux et je pourrais vraiment faire respecter une marge entre eux. Idéalement, je voudrais que cela se produise pendant l'opération de glisser de sorte que l'utilisateur puisse voir qu'ils ne peuvent pas réellement se passer les éléments (ou même trop près) les uns les autres et se rendront compte qu'ils doivent tomber ailleurs.

J'ai jeté un oeil à l'option de confinement et il ne semble pas qu'elle fera ce que je veux. Y a-t-il un moyen facile de faire cela que j'ai manqué?

Answer 1

a pu résoudre en utilisant http://sourceforge.net/projects/jquerycollision/

nécessaire d'ajouter les options draggable obstacle: '.elem: non (.ui-draggable-traînage)', preventCollision: true

où .elem est la classe des éléments draggables.

nb. le: not (.ui-draggable-dragging) est requis sinon il empêche les collisions avec lui-même et ne bougera pas