如何在 JavaScript 中確定跨瀏覽器的垂直滾動百分比？

JavaScript 中確定垂直滾動百分比的跨瀏覽器方法

在Web 開發中，經常需要確定垂直滾動的百分比用戶已經移動過的滾動條。以下方法提供了解決此問題的跨瀏覽器解決方案。

基於函數的方法

利用HTML 元素和文檔對象，我們可以計算滾動百分比，如下所示:

<code class="javascript">function getScrollPercent() {
    var h = document.documentElement, 
        b = document.body,
        st = 'scrollTop',
        sh = 'scrollHeight';
    return (h[st]||b[st]) / ((h[sh]||b[sh]) - h.clientHeight) * 100;
}</code>

jQuery 替代方案

對於喜歡jQuery 的人，可以使用事件監聽器：

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

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

限制

請注意🎜>請注意🎜>請注意🎜>請注意🎜>請注意🎜>請注意🎜>請注意🎜>請注意🎜>請注意🎜>請注意🎜>請注意🎜>請注意🎜>請注意🎜>請注意🎜>請注意🎜>請注意🎜>請注意，由於自動隱藏滾動功能，此方法可能無法在現代行動瀏覽器上準確顯示100%。

以上是如何在 JavaScript 中確定跨瀏覽器的垂直滾動百分比？的詳細內容。更多資訊請關注PHP中文網其他相關文章！