This is an old revision of the document!


Element visible in Viewport - Ist Elementes sichtbar im aktuellen Window

Diese Funktion kommt aus einem GitHub Thread. Sie testet ob ein Elemente mind. zum Teil sichtbar im aktuellen Browser-Fenster ist. Andere Funktionen die man im Internet findet bilden nur ab, dass das gesamte Element sichtbar im Browser Fenster nach scrollen ist. Dieser Code funktioniert aber auch, wenn nur ein Teil des Elementes bereits im Viewport sichtbar ist.

	function is_in_viewport( element ) {
		const rect = element.getBoundingClientRect();
		const windowHeight = (window.innerHeight || document.documentElement.clientHeight);
		const windowWidth = (window.innerWidth || document.documentElement.clientWidth);
		const vertInView = (rect.top <= windowHeight) && ((rect.top + rect.height) >= 0);
		const horInView = (rect.left <= windowWidth) && ((rect.left + rect.width) >= 0);
 
		return (vertInView && horInView);
	}

Page Tools