Ich versuche einfach, etwas zu tun, sobald die Bildlaufposition der Seite eine bestimmte Höhe erreicht hat. Gibt scrollTop()jedoch 0 zurück oder nullegal wie weit ich scrolle. Dies ist die Hilfefunktion, mit der ich den scrollTop()Wert überprüfe :
$('body').click(function(){
var scrollPost = $(document).scrollTop();
alert(scrollPost);
});
Ich habe versucht , Befestigung scrollTop()an $('body'), $('html')und natürlich $(window), aber nichts ändert.
Irgendwelche Ideen?
Antworten:
Aus irgendeinem Grund wurde dieses Problem behoben, indem 'height: 100%' aus meinen HTML- und Body-Tags entfernt wurde.
Ich hoffe das hilft jemand anderem!
window.scrollYstattdessen zu verwenden .
scrollTop()in allen Browsern inkonsistent ist und mit dem Layout des HTML gemessen werden kann. Es scheint, dass Ihre 100% -Höhe wahrscheinlich darauf zurückzuführen ist, dass ein Element in Ihrem BODYTag gescrollt hat und nicht das BODYTag selbst. Sobald Sie Ihren Körper auf volle Höhe gebracht haben, wurde darauf gescrollt, was Sie dann zum scrollTopGebrauch gemacht hat.
bodyist eingestellt, height: autowas ich glaube, es auch
Ich hatte das gleiche Problem mit scroll = 0 in:
document.body.scrollTop
Nächstes Mal verwenden
document.scrollingElement.scrollTop
Bearbeiten 01.06.2018
Wenn Sie verwenden, haben eventSie ein Objekt, das ein documentElement in targetoder enthält srcElement. 
Hier ist eine Tabelle, die den Bildlaufvorgang in verschiedenen Browsern zeigt.
Wie Sie sehen können, haben Firefox und IE nicht srcElementund IE 11 unterstützt nicht scrollingElement.
document.scrollingElement.scrollTopmobilfreundlich?!
documentElementstattdessen scrollingElementund es funktioniert;)
Meine Lösung, nachdem ich einige der oben genannten Versuche unternommen habe und bei denen kein CSS geändert werden muss:
var scroll_top = Math.max( $("html").scrollTop(), $("body").scrollTop() )
Dies funktioniert in aktuellen Versionen von Chrome, Firefox, IE und Edge.
htmlDas Scrolltop hat bei mir funktioniert. Nichts anderes hat es getan body. Ich verwende jedoch auch Bootstrap 4 und habe keine Ahnung, was es mit der Seite hinter den Kulissen macht.
Ich habe nur ein Add-On für diejenigen, die den gleichen Fehler machen könnten wie ich. Mein Code war wie folgt:
var p = $('html,body');
$( ".info" ).text( "scrollTop:" + p.scrollTop() );
Dieser Code funktioniert in allen Browsern mit Ausnahme von Webkits wie Browsern wie Chrome und Safari, da das <html>Tag immer einen scrollTop-Wert von Null oder Null hat.
Die anderen Browser ignorieren dies, während die Browser des Webkits dies nicht tun.
Die einfachste Lösung besteht darin, das HTML-Tag aus Ihrem Code et Voila zu entfernen:
var p = $('body');
$( ".info" ).text( "scrollTop:" + p.scrollTop() );
Das Entfernen height: 100%;von HTML- und Body-Tags kann das Problem beheben.
Der Grund dafür ist, dass Sie möglicherweise 100% als Wert für die height-Eigenschaft von HTML- und Body-Elementen festgelegt haben. Wenn Sie die height-Eigenschaft von HTML- und Body-Elementen auf 100% festlegen, erhalten sie eine Höhe, die der Höhe des Dokuments entspricht.
hatte das gleiche Problem. scrollTop () funktioniert mit einigen Blöcken, die kein Dokument oder Text sind. Damit diese Methode funktioniert, sollten Sie Höhe und Überlaufstil für Ihren Block hinzufügen:
#scrollParag {
height: 500px;
overflow-y: auto;
}
Und dann:
var scrolParag = document.getElementById('scrollParag');
alert(scrolParag.scrollTop); // works!
Scroll Top gab auch für mich immer 0 zurück. Ich habe es verwendet, um den Fokus auf das spezifische Element auf einer Seite zu richten. Ich habe dazu einen anderen Ansatz gewählt.
document.getElementById ("elementID"). scrollIntoView ();
Funktioniert gut für mich auf Mobilgeräten, Tablets und Desktops.
var bodyScrollTop = Math.max(document.scrollingElement.scrollTop, document.documentElement.scrollTop)
sollte auf modernen Browsern funktionieren.