Sticky deplacement ?

Version imprimable

10/12/2021, 14h15
Danyel

Sticky deplacement ?
Salut all,
J'ai un objet image en sticky (qui fonctionne parfaitement lors du scroll)
Mais j'aimerai que quand il commence a se 'sticker' lors du scroll, la position horizontale de l'image change en perdant xxx pixels. (disons 150 pixels en moins par rapport a sa position d'origine)
Mon code actuel:
Code:

1 2 3 4 5 6 7 position: sticky; position: -webkit-sticky; float: left; top: 45px; width: 65px; height: 53px; margin: 120px 0px 0px 15px;
Est ce possible et si oui comment.
Merci pour votre aide.

Bonjour,
il n'existe pas d'événements déclenchés sur le positionnement d'un élément en sticky, si tu veux gérer cela il te faut passer par du JavaScript et observer la position du scroll de ta page du type :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
document.addEventListener("DOMContentLoaded", () => {
  const element = document.getElementById("id-de-l'element");
  window.addEventListener("scroll", () => {
    // limite pour prise en compte
    const limite = "à définir";
    // ajout/suppression classe CSS de l'élément
    if (window.pageYOffset > limite) {
      element.classList.add("class-fixed");
    }
    else {
      element.classList.remove("class-fixed");
    }
  });
});

11/12/2021, 16h54
Danyel

Merci pour les infos et le js.