Web前端开发资源网Bootstrap的滚动监听还不错，可以监听滚动事件，实现导航栏的.active切换。
Bootstrap滚动监听中文文档：http://v3.bootcss.com/javascript/#scrollspy 我就不在此赘述了。
但是我发现一个问题，如果把 nav 用 .navbar-fixed-top 顶部固定，给 body 一个 padding-top: 50px，锚点设置在“微信”和“支付宝”上面，点击或者滚动滑轮，锚点还是以浏览器顶部为准，会被 nav 遮挡。如下图：
官方文档给出了一个 data-offset 属性，但是我试了很多次，好像都不管用。
参数：可以通过 data 属性或 JavaScript 传递参数。对于 data 属性，其名称是将参数名附着到 data- 后面组成，例如 data-offset=""。
名称：offset 类型：number 默认值：10 描述：计算滚动位置时相对于顶部的偏移量（像素数）
查了一些资料，也没找到简单的解决方法，应该是使用 offset 需要配合给监控元素设置 height 和 overflow auto。
尝试给 锚点 元素添加 Padding-top: 70px，可以解决 nav遮挡问题，但是上边距太大很难看。
又尝试给锚点元素添加了一个 margin-top: -50px，结果如下。
这个偏移问题困扰了我2、3天，找了很多资料也没有一个好的简单的解决方案。做后想出了这么一个方法，先设置内边距把元素撑开，再设置 margin值缩小元素之间的距离。
如果您还有更好的方法，欢迎评论或者与我QQ联系。
推荐阅读：
JetbrainsCrack-2.7激活补丁更新 亲测激活PhpStorm2018
PHP连接MySQL数据库报错：Call to undefined function mysql_connect()的解决方法