Question

我知道有很多工具可供使用，例如来自bootstrap的scrollspy或者查看你所使用的section或div以及突出显示链接的导航部分，但我所做的是什么寻找略有不同。是否有一个jQuery方法来计算页面上的位置，以便我可以显示页面上与整个事物相关的位置？我在jQuery中不够流畅。

我可以计算页面的高度并将其除以页面上的位置（当前位置）以给出一个百分比，以便我可以不断显示我的位置吗？有没有方法可以做到这一点？

Answer 1

jQuery方法： scrollTop（） - 返回滚动条的当前垂直位置

height（） - 返回第一个匹配元素的计算高度

当用户在页面末尾时，您可能希望显示100％。

所以你可以使用以下来获得百分比：

（$（window）.scrollTop（）+ $（window）.height（））/ $（document）.height（））* 100

Answer 2

修改此答案中的代码：Cross-Browser Method to Determine Vertical Scroll Percentage in Javascript

你可以这样做。您可以使用在屏幕上更新内容所需的任何代码替换console.log。

$(function() {

  $(window).scroll(function() {
    var s = $(window).scrollTop(),
      d = $(document).height(),
      c = $(window).height();
    scrollPercent = (s / (d - c)) * 100;

    console.log("Current scroll percent: " + scrollPercent);
  });
});

页面位置 - 根据位置在侧面填充导航栏

2 个答案: