Comment puis-je détecter la direction de défilement en utilisant JavaScript sans jQuery ?

Détection de la direction de défilement

En utilisant l'événement scroll de JavaScript, il est possible de déterminer la direction de défilement sans avoir besoin de jQuery.

Détection de la direction de défilement

Pour ce faire, nous stockerons la valeur scrollTop précédente et la comparerons à la valeur scrollTop actuelle.

<code class="javascript">var lastScrollTop = 0;

// element should be replaced with the actual target element on which you have applied scroll, use window in case of no target element.
element.addEventListener("scroll", function () { // or window.addEventListener("scroll"....
  var st = window.pageYOffset || document.documentElement.scrollTop; // Credits: "https://github.com/qeremy/so/blob/master/so.dom.js#L426"
  if (st > lastScrollTop) {
    // downscroll code
  } else if (st < lastScrollTop) {
    // upscroll code
  } // else was horizontal scroll
  lastScrollTop = st <= 0 ? 0 : st; // For Mobile or negative scrolling
}, false);</code>

En utilisant ceci méthode, vous pouvez détecter avec précision le sens de défilement dans n'importe quelle page Web sans compter sur des bibliothèques tierces.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!