Überlagerung von HTML-Elementen ermitteln

[Michael_K]

Hallo,

kann mir jemand sagen, ob man Überlagerungen von HTML-Elementen in einer Webseite automatisch per Software feststellen kann. Meine Vermutung ist nein, ich will aber sichergehen. Bzw. waere es bestimmt nicht trival zu ermitteln, oder?

Was meine ich mit Ueberlagerung? Wenn ein Element bei der Darstellung im Browser ueber/unter einem anderen Element liegt.

Gruss, Michael

[Rolf B]

Hallo Michael_K,

mit JavaScript.

Für zwei beliebige Elemente ermittelst Du ihre umschließenden Rechtecke mit getBoundingClientRect und prüfst dann, ob die Rechtecke sich überschneiden. Das sind ein paar Tests auf Randkoordinaten.

Für Animationen gibt es auch das Intersection Observer API.

Was willst Du tun?

Rolf

[Michael_K]

Hallo Rolf

Für zwei beliebige Elemente ermittelst Du ihre umschließenden Rechtecke mit getBoundingClientRect und prüfst dann, ob die Rechtecke sich überschneiden. Das sind ein paar Tests auf Randkoordinaten.

Geht das auch für ELement ausserhalb des sichtbaren Bereichs des Browsers?

Für Animationen gibt es auch das Intersection Observer API.

Danke, kannte ich bisher noch nicht, muss ich mal nachlesen.

[Der Martin]

Hallo,

Für zwei beliebige Elemente ermittelst Du ihre umschließenden Rechtecke mit getBoundingClientRect und prüfst dann, ob die Rechtecke sich überschneiden. Das sind ein paar Tests auf Randkoordinaten.

Geht das auch für ELement ausserhalb des sichtbaren Bereichs des Browsers?

ja, die Koordinaten sind bezogen auf das gesamte Dokument. Welcher Bereich davon im Browser zu sehen ist, spielt keine Rolle.

Live long and pros healthy,
 Martin