Heim  >  Artikel  >  Web-Frontend  >  Wie kann ich die Scrollrichtung mit JavaScript ohne jQuery erkennen?

Wie kann ich die Scrollrichtung mit JavaScript ohne jQuery erkennen?

Mary-Kate Olsen
Mary-Kate OlsenOriginal
2024-10-27 03:01:30537Durchsuche

How can I detect scroll direction using JavaScript without jQuery?

Bildlaufrichtung erkennen

Mithilfe des Scroll-Ereignisses von JavaScript ist es möglich, die Bildlaufrichtung zu bestimmen, ohne dass jQuery erforderlich ist.

Bildlaufrichtung erkennen

Um dies zu erreichen, speichern wir den vorherigen scrollTop-Wert und vergleichen ihn mit dem aktuellen scrollTop-Wert.

<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>

Indem wir dies verwenden Mit dieser Methode können Sie die Scrollrichtung auf jeder Webseite genau erkennen, ohne auf Bibliotheken von Drittanbietern angewiesen zu sein.

Das obige ist der detaillierte Inhalt vonWie kann ich die Scrollrichtung mit JavaScript ohne jQuery erkennen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn