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

**Thirsty** · 02/03/2020, 09h45

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

**javatwister** · 02/03/2020, 18h44

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.

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).

**Thirsty** · 02/03/2020, 18h55

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.

**javatwister** · 02/03/2020, 20h18

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

Code html :

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

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"
})

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

JavaScript

Vue hybride

Discussions similaires

Partager

Partager