阅读进度 html,Scrollgress – 根据页面长度实现的阅读进度条插件

Scrollgress – 根据页面长度实现的阅读进度条插件

10月 16, 2015

评论

Sponsor

Scrollgress 可以算是一个不错的交互jQuery插件，通过进度条的方式告诉访客你当前的阅读进度，特别对于长文章，这个进度条的作用更为理想。

Scrollgress 的运作是这样的，当用户在阅读文章时并向下滚动页面的同时，在页面上方会出现一个进度条动画，用户阅读完后，就会滚动完成。

还有个好处就是，这个页面长度可以根据ID容器来判断，而不是整个浏览器的高度，这个很赞！

页头

页中

页尾

使用方法

STEP 1: 在网页中引入插件和jQuery库

STEP 2: 添加JS代码，可以把body改为你的阅读内容所在的容器ID

$('body').scrollgress();

还有其它设置选项，可以到下载页查看该Jquery插件的详细说明。

推荐：查看最受欢迎的 301 个设计网站 → http://hao.shejidaren.com

交流：为设计新人提供的设计交流群，请加入UI设计交流群，分享经验、接单、求职、聊设计。

赞助商链接

赞助商链接

喜欢这篇文章吗？欢迎分享到你的微博、QQ群，并关注我们的微博，谢谢支持。

版权：除非注明，本站文章均为原创文章，转载请联系我们授权，否则禁止转载。

{ 发表评论 }

姓 名 (必填)

邮 件 (必填)

网 站