Bonsoir à tous,

je débute en Javascript et je rencontre un problème avec le code que j'essaye de réaliser.

Je vais essayer d'être le plus claire possible, pardon d'avance si tout ça est un peu confus .

J'ai une div que je souhaite faire apparaître lors du scroll de ma page (au moment ou la dite div dépasse le bas de ma page).

J'ai réussi pour l'instant à exécuter ce code en récupérant une valeur "en dur" et en ajoutant une classe "opacity" à 150px.

Voici mon code :

'use strict';

document.addEventListener('DOMContentLoaded', function (){
	var div;
	var position;
	div = document.querySelector('.div');
	window.addEventListener('scroll', function(){
		position = window.scrollY;
		//console.log(position)
		if( position >= 150 )
		{
			div.classList.add('opacity');
		}
		else{
			div.classList.remove('opacity');
		}
	});
});

Cependant cet technique n'est pas responsive, et je souhaiterai savoir s'il existe un moyen de détecter le moment ou ma div dépasse le bas de ma page, afin de ne pas avoir de valeur en pixels fixe et de pouvoir appliquer ce comportement à d'autres elements.

Je vous remercie d'avance pour votre réponse !

Tamy

-
Edité par tamy13 15 juin 2018 à 20:50:50