Discussion :

[yococopier]

Bonjour,

Tout est plus ou moins dit dans le titre je pense que c'est pas trop compliqué mais je suis trop naze en js :/

En gros, j'essaie de faire :

- quand un element (#monelement) devient visible (au scroll) dans le viewport -> addclass au body
- quand un element (#monelement) devient disparait de l'ecan (au scroll) -> removeclass au body

Et surtout je suis graphiste/intégrateur html et trop nul en js pour l'ecrire... :/
J'arrive a le fair een mettant une taille donné pour le scroll mais je ne peux pas pour ce cas de figure car la hauteur de scroll varie d'un page à l'autre...

MA reconnaissance éternelle à mon sauveur

ME

[Doksuri]

salut, je t'invite a te documenter sur getBoundingClientRect() developer.mozilla.org/fr/docs/Web/API/Element/getBoundingClientRect
tu auras aussi besoin de la hauteur de ton ecran : developer.mozilla.org/fr/docs/Web/API/Window/innerHeight

[javatwister]

salut,

et voir aussi l'excellente contribution de l'excellent Bovino, il y a déjà longtemps:

https://www.developpez.net/forums/d6...n/#post3932542

(source que j'ai pompée honteusement ici, même si les inner et les Offset ont tendance à ne pas être standard)

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
window.addEventListener("wheel", scrollwheel);
window.addEventListener("scroll", scrollwheel);
 
function scrollwheel(){
	if(document.querySelector("#div").offsetTop > window.pageYOffset
	&& document.querySelector("#div").offsetTop < window.pageYOffset+window.innerHeight){
		document.body.style.background="blue"
	}
	else{
		document.body.style.background="none"
	}
}

[yococopier]

Merci beaucoup pour vos réponses !