Wie kann ich erkennen, wenn ein Benutzer zum Ende eines Nicht-Fensterelements scrollt?

Erkennen des Scrollens bis zum Ende von Nicht-Fensterelementen

Paginierungssysteme, wie sie von Facebook verwendet werden, laden zusätzliche Inhalte, wenn Benutzer sich dem nähern unten auf der Seite. Um dies zu erreichen, ist es wichtig festzustellen, wann ein Benutzer nach unten gescrollt hat, über das sichtbare Fenster hinaus.

Lösung mit jQuery:

jQuery bietet eine effiziente Möglichkeit dazu Überwachen Sie die Scrollaktivität. Durch die Verwendung des .scroll()-Ereignishandlers für das Fensterobjekt können Sie einen Listener einrichten, der immer dann ausgelöst wird, wenn sich die Bildlaufposition ändert. Der folgende Code zeigt, wie man erkennt, wenn ein Benutzer den unteren Rand der Seite erreicht hat:

$(window).scroll(function() {
   if($(window).scrollTop() + $(window).height() == $(document).height()) {
       alert("bottom!");
   }
});

Dieser Code berechnet den Abstand vom oberen Rand der Seite zur aktuellen Scrollposition des Benutzers ($(window)). scrollTop()) und addiert es zur Höhe des sichtbaren Fensters ($(window).height()). Wenn diese Summe der Gesamthöhe des Dokuments ($(document).height()) entspricht, bedeutet dies, dass der Benutzer nach unten gescrollt hat.

Bestimmen der Nähe zum Boden:

Ein alternatives Szenario könnte darin bestehen, zu erkennen, wann sich der Benutzer dem Boden nähert, anstatt ihn genau zu erreichen. Um dies zu erreichen, ändern Sie den Code leicht wie folgt:

$(window).scroll(function() {
   if($(window).scrollTop() + $(window).height() > $(document).height() - 100) {
       alert("near bottom!");
   }
});

Dieser Code löst die Warnung „nahe dem unteren Rand“ aus, wenn der Benutzer innerhalb von 100 Pixeln vom unteren Rand scrollt. Passen Sie den Wert „100“ nach Bedarf an, um den gewünschten Näherungsschwellenwert zu definieren.

Das obige ist der detaillierte Inhalt vonWie kann ich erkennen, wenn ein Benutzer zum Ende eines Nicht-Fensterelements scrollt?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!