Nous utilisons le plugin JQuery UI Draggable et doivent désavouer chevauchement entre nos éléments. Nous pourrions écrire nous-mêmes un peu de détection de collision, mais nous préférerions utiliser un paquet testé. Aucune suggestion?S'il vous plaît recommander un plugin JQuery qui gère la détection de collision pour les éléments déplaçables
Google me dit que gameQuery, un plugin JQuery, a une fonction "collision":
http://gamequery.onaluf.org/#manual
Recherchez le mot "collision" sur la page ci-dessus.
Cette recherche google peut vous donner quelques autres options:
Recherche rapide des plugins jQuery tours dans:
On dirait qu'il est encore tôt, mais peut-être vaut la peine de vérifier.
En supposant, mais je pense que ce que vous avez besoin se trouve ici:
Il utilise la .event.special.drag célèbre $ jQuery pour créer de l'événement drop. Vous pouvez mettre votre propre code javascript sous le .bind("drop", function(event){ cet élément l'intérieur de cette fonction représente l'objet avec la « baisse » de la classe que vous avez défini et le event.dragTarget est l'objet qui est en cours de déplacement.
Plus doc sur le site lié ci-dessus. C'était ce dont j'avais besoin de toute façon.
Je sais que cette question est assez vieux, mais peut-être vous trouverez ce utile: notre Collision Check Plugin for jQuery.
La description est en allemand, mais il devrait être explicite. Vous pouvez utiliser deux éléments simples ou même des ensembles d'éléments et récupérer un ensemble de tous les éléments en collision.
Vous pouvez jquery-collision, plus jquery-ui-draggable-collision. Divulgation complète: Je viens d'écrire et de les publier sur sourceforge.
La première permet ceci:
var hit_list = $("#collider").collision(".obstacle");
qui est la liste de tous ".obstacle" qui se chevauchent "#collider".
La seconde permet:
$("#collider").draggable({ obstacle: ".obstacle" });
Ce qui vous donne (entre autres), un événement "collision" pour se lier à:
$("#collider").bind("collision", function(event,ui){...});
Et vous pouvez même définir:
$("#collider").draggable({ obstacle: ".obstacle", preventCollision: true });
pour éviter que "#collider" chevauche un ".obstacle" lors du glissement.
Je viens de télécharger votre script de collisionneur, c'est fantastique! Comment est-ce que je pourrais avoir une grille de DIVs qui se développent en vol stationnaire, et les autres divs (non planés) se rétréciront-ils à mesure que le div planétaire se développera? – Tom
@tom: je ne sais pas ce que vous voulez dire par là. si vous voulez simplement changer leur taille en survol, faites-en une classe "growable" et dans un callback hover changez la taille de '$ (this)' en plus grand et '$ (". growable ") .non ($ (ceci)) 'à plus petit. Je ne suis pas sûr de ce que cela a à voir avec la collision, donc je pourrais être malentendu. merci pour les félicitations cependant, cela signifie beaucoup pour moi. :-) – eruciform
Merci pour la réponse. J'essaye d'accomplir cet effet (http://www.adidas.com/us/homepage.asp). Comme vous pouvez le voir, comme une boîte grandit, d'autres rétrécissent pour s'adapter à sa taille. Je pense que la détection de collision est la meilleure façon de procéder, car j'ai besoin que les boîtes rétrécissent dans le sens de la croissance de la boîte, que votre plugin pourrait détecter (N S E et W). – Tom