jQuery scrollTop()位置到百分比

Question

<script>
document.getElementById('listen-btn').addEventListener('click', function() {
    document.getElementById('music-player').play();
});

​

<script>
    $(window).scroll(function() {
        if($(window).scrollTop() > 1400)
        document.querySelector('#music-player').pause();
    });
</script>

该按钮启动音频播放器，并滚动到音频播放器可见的区域。当你滚动“下一部分”时，一旦你滚动了1400，音频播放器就会停止，但我需要它是相对的。如何将1400作为百分比(50%)

Answer 1

这是可能的--一些算术运算就可以完成这项工作。诀窍是使用$(document).height()检索页面高度。但是，如果您指的是视口高度，则需要使用$(window).height()。

$(window).scroll(function() {
    if($(window).scrollTop() > $(document).height()*0.5)
    document.querySelector('#music-player').pause();
});

Answer 2

尝试使用以下代码：

$(window).on('scroll', function() {
   var st = $(this).scrollTop();
   var wh = $(document).height();

// st : wh = X : 100
// x = (st*100)/wh

var perc = (st*100)/wh

// Your percentage is contained in perc variable

console.log('The percentage is '+perc);

});