Liebe Silke,
Hintergrund: der Browser eines Mobile Devices soll detektieren, ob ein Element über ein anderes geschoben wird.
wir sprechen von einer drag&drop-artigen Situation? Dazu benötigst Du im Grunde die üblichen Kandidaten wie
- mousedown
- mouseup
- touchstart
- touchend
- touchcancel
Um zu erkennen, ob eine Koordinate (z.B. eine Ecke Deines gerade bewegten Elements) innerhalb der Box eines anderen Elements ist, benötigst Du diesen Code:
/**
* collision detection
*
* @param DOMElement some node
* @param Object { left: (int), top: (int) }
* @return bool
*/
function isCollidingWidth (element, lastCoords) {
let rect = element.getBoundingClientRect();
// last position inside test element?
if (rect.top < lastCoords.top
&& rect.left < lastCoords.left
&& rect.bottom > lastCoords.top
&& rect.right > lastCoords.left
) {
// yes!
return true;
}
}
Im Wesentlichen ist dieser Code aus meinem R-Quiz, bei dem mobile Geräte damit Drag&Drop auf Zielfelder machen können.
Liebe Grüße,
Felix Riesterer.