Changer la couleur du menu au défilement de la page

Version imprimable

02/03/2020, 08h45
Thirsty

Changer la couleur du menu au défilement de la page

Bonjour,

Je cherche à changer la couleur de mon menu lorsque je ne suis pas tout en haut.
J'ai essayé de différentes façon mais je n'obtiens aucun résultat.

J'utilise WordPress et DIVI, ainsi que du code supplémentaire en Css.

Si quelqu'un a une idée, je veux bien l'entendre

Merci

Cordialement,
Thirsty
02/03/2020, 17h44
javatwister

Bonjour,

Bienvenue sur le forum consacré à JavaScript.

Pour l'instant, je dirais qu'il manque à ta requête un morceau de code html et au moins un essai de gestion du problème avec JS.

Citation:

la couleur de mon menu lorsque je ne suis pas tout en haut

Moins précis, tu meurs. As-tu un menu qui suit le défilement de la page?
Question plus indiscrète: Pourquoi cette fantaisie? (je sens que c'est important dans ton projet).
02/03/2020, 17h55
Thirsty

Je ne peux éditer mon message précédent.

Oui mon menu est visible même si je scroll.
Il reste en haut de l écran.

Schématiquement, tu changes ta couleur quand tu scrolles...

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<style>
#c{margin:50px;width:100%;position:fixed;}
#m {margin:auto;text-align:center;width:20%;font:70px bold;border:inset 5px silver}
</style>
 
</head>
<body>
<div id="c">
	<div id="m">Menu</div>
</div>     
 
<div style="height:800px;">contenu</div>
<div style="height:800px;">contenu</div>
 
<script>
window.addEventListener("scroll",()=>{
        document.getElementById('m').style.backgroundColor=
        document.documentElement.scrollTop>0 ? "grey" : "white"
})