javascript - 跨浏览器确定Javascript垂直滚动百分比的方法

Question

如何找出用户在任何给定点移动过的垂直滚动条的百分比？

当用户向下滚动页面时，很容易触发 onscroll 事件，但我如何在该事件中找出他们滚动了多远？在这种情况下，百分比尤为重要。我并不是特别担心 IE6 的解决方案。

是否有任何主要框架(Dojo、jQuery、Prototype、Mootools)以简单的跨浏览器兼容方式公开此内容？

Answer 1

Oct 2016: Fixed. Parentheses in jsbin demo were missing from answer. Oops.

Chrome、火狐、IE9+。 Live Demo on jsbin

var h = document.documentElement, 
    b = document.body,
    st = 'scrollTop',
    sh = 'scrollHeight';

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

作为函数:

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;
}

如果您更喜欢 jQuery(原始答案):

$(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);
})

html{ height:100%; }
body{ height:300%; }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>