Estamos usando el plugin de la IU de JQuery Draggable y no debemos permitir la superposición entre nuestros elementos. Podríamos escribir alguna detección de colisión nosotros mismos, pero preferiríamos usar un paquete probado. ¿Alguna sugerencia?Recomendamos un plugin JQuery que maneje la detección de colisiones para elementos que se pueden arrastrar
Google me dice que gameQuery, un plugin de jQuery, tiene una función de "colisión":
http://gamequery.onaluf.org/#manual
buscar la palabra "colisión" en la página anterior.
Esta búsqueda Google le puede dar un par de otras opciones:
Búsqueda rápida de plugins jQuery surja:
Parece que todavía es temprano, pero podría vale la pena echarle un vistazo.
Suponiendo, pero creo que lo que se necesita se puede encontrar aquí:
Se utiliza el famoso $ .event.special.drag jQuery para crear caso de caída. Puede poner su propio código de JavaScript bajo .bind("drop", function(event){ este elemento dentro de esta función representa el objeto con la clase "drop" que ha definido y event.dragTarget es el objeto que se está arrastrando.
Más documentación en el sitio vinculado anteriormente. Esto era lo que necesitaba de todos modos.
Sé que esta pregunta es bastante antigua, pero quizás le resulte útil: nuestra Collision Check Plugin for jQuery.
La descripción está en alemán, pero debe ser autoexplicativa. Puede usar dos elementos individuales o incluso conjuntos de elementos y obtendrá un conjunto de todos los elementos colisionantes.
Puede intentar jquery-collision plus jquery-ui-draggable-collision. Divulgación completa: acabo de escribir y publicar estos en sourceforge.
El primero permite esto:
var hit_list = $("#collider").collision(".obstacle");
que es la lista de todos ".obstacle" que se superponen "#collider".
El segundo permite:
$("#collider").draggable({ obstacle: ".obstacle" });
que le da (entre otras cosas), un evento de "colisión" de obligar a:
$("#collider").bind("collision", function(event,ui){...});
e incluso se puede configurar:
$("#collider").draggable({ obstacle: ".obstacle", preventCollision: true });
para evitar que "#colisionador" se solape con cualquier ".obstacle" mientras se arrastra.
Acabo de descargar su script collider, ¡es fantástico! ¿Cómo me gustaría tener una grilla de DIV que crecen al vuelo estacionario y que los otros divs (no suspendidos) se encojan a medida que crece el div estacionario? – Tom
@tom: no estoy seguro de lo que quiere decir con eso. si solo quieres cambiar su tamaño al colocar el cursor sobre su vuelo, conviértelos todos en una clase "cultivable" y en una devolución de llamada flotante cambia el tamaño de '$ (this)' a mayor y '$ (" growable "). not ($ (esto)) 'a más pequeño. sin embargo, no estoy seguro de lo que tiene que ver con la colisión, por lo que podría ser un malentendido. gracias por las felicitaciones, significa mucho para mí. :-) – eruciform
Gracias por la respuesta. Estoy intentando lograr este efecto (http://www.adidas.com/us/homepage.asp). Como puede ver, a medida que una caja crece, otros se encogen para acomodar su tamaño. Estoy pensando que la detección de colisiones es la mejor manera de hacerlo, ya que necesito que las cajas se encojan en la dirección en que crece la caja, que tu complemento podría detectar (N S E y W). – Tom