[Résolu] HELP aide en JS

Bonjours à tous et à toutes,

J'essaye de ancrer un menu avec un ajout de class en JS, jusque la tout va bien,
mais j'aimerai le dé-ancrer ( donc retirer la class) lorsque la hauteur de .wrapper est passée au delà du window.
y a un gros problème dans ma récupération de données et dans leurs application.
idealement remplacer le pageYOffset par la hauteur de la section wrapper.

Voici l'exemple:
https://codepen.io/nwx/pen/BJdoKM?editors=1010

Code js:

 window.onscroll = function() {
     if (window.pageYOffset > 370 ) {
      title.classList.add("fixed");
      //title.style.top = 0;
     } else if ( scrollTop > height_section ) {
      title.classList.remove("fixed");
     } else {
      title.classList.remove("fixed");
    };
  }
 
})

Merci d'avance de votre aide ^^

Cordialement
Modifié par newger (04 Jan 2018 - 22:51)

Salut

J'ai pas trop trop compris,

Mais en lisant le code, je vois que dès que t'a dépasser 370 PX de scroll, alors le title est en fixed. et ce pour toujours si on continue à scroller vers le bas. le code rentre dans le if et non dans les elses comme tu le souhaite.

Oui c'est le problème, quand on arrive à la section portfolio, le texte portfolio se ancre bien mais arrivé à la fin de cette section le texte dois monter.
Je voudrai qu'a la fin de la section verte (.wrapper) qui fait 377px le Titre Portfolio perde sont position fix.

C'est un peu plus clair ? ^^ faudrai que je trouve un exemple mais c'est lglobalement e système d'ancrage.

On dirait que tu veux réinventer la roue:
En CSS3, il y a la position:sticky qui fait cela en 2 lignes
https://forum.alsacreations.com/topic-4-80151-1-A-propos-de-la-position-sticky.html
https://developer.mozilla.org/fr/docs/Web/CSS/position
Va sur mon site pour savoir si cela correspond à ce que tu cherches.

oui position fixed en gros mais ça ca march mais l'idée de fixer l'element une fois qu'il est au top du window mais le dé-fixer lorsque la hauteur de ca section est passé, donc il faut récupérer la hauteur de la section et faire des math et de la bonne syntaxe ^^ tu vois ce que je veux dire ( lire) ?

comme ici:

https://codepen.io/eeebb/pen/wBmWaE?q=sticky%20menu&order=popularity&depth=everything&show_forks=false
Modifié par newger (10 Jan 2018 - 11:35)

Roooooh !!! enorme !!! j'avais pas tilté !! je met ca en place trop bien un grand merci !!!!

yep!! thx
pen: https://codepen.io/nwx/pen/EoEKdL
Modifié par newger (10 Jan 2018 - 12:36)