[Résolu] Position absolute et fixed

Bonjour a tous!
voila j'ai une petite questions, car apres plusieurs essaie, et une perte totale d'idée je vient demander de l'aide...

Voila je vous explique mon problème...
j'ai un slogan sur mon site il se trouve en position absolute car j'aimerai qu'il fasse toute la largeur de mon body...
mais bien sur, il est en dessous de mon header....
avec une position absolute pas de probleme le slogan fait bien tout la longueur du site...

Mais la c'est plus compliqué...

car j'aimerait que lorsque je scrool vers le bas le slogan monte et reste bloquer en haut de la page... et quand je remonte qu'il reprenne sa place initial...

Avez vous des solutions?


Merci d'avance ! car la je me noie sous mes larmes

Hum... oui j'ai déjà essayer... mais je pense que comme il est deja en position absolute,
le fait de lui mettre au scroll une position fixed... et bien ça ne marche pas...
de mettre cette 2 positions ne crée pas un désaccord?

Bonjour,
Si j'ai bien compris la question, je pense comme Yokii qu'il faut mettre position:fixed
et uniquement position fixed (il faut enlever position:absolute)
Modifié par jlon (17 Jun 2014 - 17:46)

oui mais si je retire ma position Absolute, comment puis-je faire pour que mon slogan avec un background fasse tout la longueur de mon body...
sachant que ce slogan ce trouve dans mon Wrapper...?

Nyny a écrit :
de mettre cette 2 positions ne crée pas un désaccord?

l'un écrase forcément l'autre : position a pour valeur soit fixed soit absolute (soit relative soit static m'enfin pas ici)

Nyny a écrit :
comme il est deja en position absolute, le fait de lui mettre au scroll une position fixed... et bien ça ne marche pas...

Qu'est-ce que tu appelles "au scroll (changer la valeur)" ?
Comme ton élément n'est pas collé en haut de ta page au chargement de celle-ci, il faudrait en JS surveiller la position en Y du bord haut de ton élément et lorsqu'il est inférieur à 0 (il est partiellement ou complètement masqué parce que l'utilisateur a scrollé), le positionner en fixed. Puis si l'utilisateur rescrolle vers le haut, surveiller le moment où il faut rechanger la valeur de la propriété position.
Mais si l'élément est fixed, ça bougera forcément plus... Il faut plutôt surveiller où en est le scroll dans la page et la valeur initiale de la position Y du bord haut de l'élément.

Tu peux regarder "position sticky" sur MDN en particulier et des scripts qui s'appellent comme ça.

Ouhhh Super ce petit Sticky !
Merci beaucoup !!

A bientot !