11503 sujets

JavaScript, DOM et API Web HTML5

Bonjour tout le monde,

J'ai un soucis je commence l'apprentissage de JS et actuellement je bloque sur la disparition et apparition de la nav barre selon mon scroll (vers le top ou le bot).

J'ai l'impression que c'est ma condition qui est mauvaise mais je ne trouve pas la solution est-il possible de m'aider ?
upload/1685444096-85813-capturedncran2023-05-30145418.png
upload/1685444126-85813-capturedncran2023-05-30145330.png upload/1685444107-85813-capturedncran2023-05-30145341.png
Modérateur
Salut !

Tout d'abord bienvenu sur le forum ! On espère que tu te plaira ici.

Pour les code, plutot que d'ne faire des copie d'écran inutilisable pour nous tu peux directement le copier dans ton message, il y a même des balises de coloration syntaxique prévue en fonction des langages (En dessous des smilley "Colorisation syntaxique" il suffit de mettre le code entre les balises). Si le code est trop long tu peux passer par des services (gratuits) comme https://codepen.io/pen/ ou https://jsfiddle.net/ qui auront l'avantage de faire tourner le code (c'est tres pratique pour nous montrer un comportement).

Pour ta condition tu essaie de savoir quand Y est supérieur a Y-100 donc c'est un peu tout le temps. En fait il faut que tu conserves la valeur du scrollY dans une variable (externe à la fonction pour ne pas la perdre) et si le nouveau scrollY est inferieur ca veut dire que ca monte et inversement.

Bonne journée
Salut,

fais des copier-coller de tes bouts de code dans les balises approprié, là des images on peut rien en faire sans devoir tout se retaper Smiley ohwell

Sans tester juste en lisant ton code javascript ta condition me semble fausse (ou au moins problématique à cause de l'affectation du x) :
var x = window.scrollY - 100;
<=> window.scrollY - x =100
=> window.scrollY - x>0
<=> window.scrollY > x

Je dirais qu'en l'état il doit toujours rentrer dans le if et jamais dans le else ?
Tu cherches à faire quoi exactement ? Détecter le sens du scroll (vers le haut ou vers le bas ?) ou détecter une position à partir de laquelle tu affiches / caches un élément ?

Pour le premier cas je dirais de déclarer/initialiser le x en dehors de la fonction addEventListner et de la mettre à jour après le if/else.
Pour le 2e cas je dirais de ne pas utiliser le x ou de juste le declarer en dehors de la fonction puis de plus le changer.

Edit Smiley angryfire : Il faut que j’arrête de faire autre chose quand je réponds après je suis ultra en retard Smiley bawling
Modifié par Mathieuu (30 May 2023 - 14:46)
Modérateur
Mathieuu a écrit :
Edit Smiley angryfire : Il faut que j’arrête de faire autre chose quand je réponds après je suis ultra en retard Smiley bawling

Hahaha en plus j'ai attendu cette fois pour etre sur Smiley lol

Mais au moins ca viens compléter la réponse Smiley cligne