Heim > Artikel > Web-Frontend > So bestimmen Sie die Richtung des Scroll-Ereignisses in JQuery

So bestimmen Sie die Richtung des Scroll-Ereignisses in JQuery

coldplay.xixiOriginal: 2020-11-23 10:06:041967Durchsuche

So bestimmt JQuery die Richtung eines Scroll-Ereignisses: Verwenden Sie die Methode [scrollTop()], um die vertikale Scroll-Bar-Position des ausgewählten Elements festzulegen oder zurückzugeben. Die Syntax lautet [$(selector).scrollTop(position)].

Die Betriebsumgebung dieses Tutorials: Windows 7-System, JQuery-Version 3.2.1. Diese Methode ist für alle Computermarken geeignet.

jquerys Methode zum Bestimmen der Richtung eines Scroll-Ereignisses:

In jQuery können Sie die scrollTop()-Methode verwenden, um die Richtung eines Scroll-Ereignisses zu bestimmen. Die scrollTop()-Methode wird verwendet, um die Vertikale festzulegen oder zurückzugeben Position der Bildlaufleiste des ausgewählten Elements. Mit dieser Methode können wir die Scrollrichtung bestimmen.

<code><strong>jQuery scrollTop()</strong>jQuery scrollTop()

method

scrollTop()-Methode legt die vertikale Bildlaufleistenposition des ausgewählten Elements fest oder gibt sie zurück.

Tipp: Wenn sich die Bildlaufleiste oben befindet, ist die Position 0.

Syntax:

$(selector).scrollTop(position)

Parameter: Diese Methode akzeptiert eine einzelne Parameterposition, die optional ist. Es wird verwendet, um die vertikale Position der Bildlaufleiste in Pixeln anzugeben.

Rückgabewert: Gibt die vertikale Position der Bildlaufleiste des ausgewählten Elements zurück.

Beispiel:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
html,body {
height: 300%
}
div {
position: fixed;
padding-left: 10px;
padding-top: 30px;
height: 10%;
width: 35%;
font-weight: bold;
border: 2px solid red;
}
</style>
</head>
<body>
<div></div>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script>
var position = $(window).scrollTop();
$(window).scroll(function() {
var scroll = $(window).scrollTop();
if(scroll > position) {
console.log(&#39;scrollDown&#39;);
$(&#39;div&#39;).text(&#39;向下滚动&#39;);
} else {
console.log(&#39;scrollUp&#39;);
$(&#39;div&#39;).text(&#39;向上滚动&#39;);
}
position = scroll;
});
</script>
</body>
</html>

(Video)

🎜

Das obige ist der detaillierte Inhalt vonSo bestimmen Sie die Richtung des Scroll-Ereignisses in JQuery. 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

Vorheriger Artikel：So ermitteln Sie, ob ein Objekt ein JQuery-Objekt istNächster Artikel：So ermitteln Sie, ob ein Objekt ein JQuery-Objekt ist

In Verbindung stehende Artikel

Mehr sehen