Wie kann der vertikale Scroll-Prozentsatz in JavaScript browserübergreifend genau bestimmt werden?

Bestimmen des vertikalen Scroll-Prozentsatzes browserübergreifend in JavaScript

In der Webentwicklung ist es oft wichtig, die vertikale Scroll-Position von Benutzern zu überwachen. Es kann jedoch eine Herausforderung sein, eine genaue und browserübergreifend kompatible Methode zu finden.

Browserübergreifende Lösung

Das bereitgestellte Code-Snippet bietet einen browserübergreifenden Ansatz zur Berechnung des vertikalen Scroll-Prozentsatzes:

<code class="javascript">var h = document.documentElement, 
    b = document.body,
    st = 'scrollTop',
    sh = 'scrollHeight';

var percent = (h[st]||b[st]) / ((h[sh]||b[sh]) - h.clientHeight) * 100;</code>

Dieser Code kann implementiert werden, indem die HTML- und Body-Elemente in den Variablen h und b zusammen mit den String-Namen für scrollTop und scrollHeight (st und sh) gespeichert werden. Der Scroll-Prozentsatz wird dann berechnet, indem die aktuelle vertikale Scroll-Position durch die Höhe des Ansichtsfensters dividiert wird, skaliert auf 100 %.

jQuery-Implementierung

Für diejenigen, die jQuery bevorzugen, kann der folgende Code verwendet werden:

<code class="javascript">$(window).on('scroll', function(){
  var s = $(window).scrollTop(),
      d = $(document).height(),
      c = $(window).height();

  var scrollPercent = (s / (d - c)) * 100;
  
  console.clear();
  console.log(scrollPercent);
});</code>

Vorbehalt

Es ist zu beachten, dass diese Lösung auf modernen mobilen Browsern aufgrund des automatischen Ausblendverhaltens der Browser-Benutzeroberflächen möglicherweise nicht 100 % erreicht.

Das obige ist der detaillierte Inhalt vonWie kann der vertikale Scroll-Prozentsatz in JavaScript browserübergreifend genau bestimmt werden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!