überprüfen, ob zwei div HTML-Elemente schneiden

Question

Wie überprüft man, ob zwei div HTML Elemente sich schneiden/überlappen/sich berühren?

• Die beiden divs sind an der X-Achse befestigt, so dass sie nur nach oben bewegen kann und nach unten

habe ich beide top und bottom Positionen für beide div Elemente

Answer 1

Wenn Sie bereits beide top und bottom, dann ist es nur eine Bedingung:

if ((top1 <= top2 && bottom1 >= top2) || (top2 <= top1 && bottom2 >= top1)) { // intersect/overlap/touch }

Answer 2

Ich schlage vor, dass Sie ihnen eine gewisse Größe zuweisen (Breite, Höhe und Rand). Sie können auch den UI-Debugger verwenden (indem Sie den F12-Schlüssel verwenden), um zu sehen, wo sich diese befinden.