bookmarklet 显示当前页面的进度,其实没卵用。

2016-01-22 22:26:01 +08:00
 dyniao

将代码接放到标签栏,然后点击就可以显示页面的滚动进度。看着玩吧!

js 放到页面里运行没问题,但是放到 bookmarklet ,开始运行没有初始值,不知道怎么回事,求解答!

v2 ,超链接不支持 js 的。那就贴上源码,自行添加吧!

javascript:void((function(){function c(){var b=document.getElementById("processjQJ8kWLTA7mNRs"),c=b.innerHTML.replace("%",""),a=b.getContext("2d");b.a=!0;b.width=50;b.height=50;a.clearRect(0,0,25,25);a.beginPath();a.moveTo(25,25);a.arc(25,25,25,0,2*Math.PI,!1);a.fillStyle="#e6e6e6";a.fill();a.beginPath();a.moveTo(25,25);a.arc(25,25,25,-.5*Math.PI,-.5*Math.PI+2*Math.PI*c/100,!1);a.closePath();a.fillStyle="#ff8000";a.fill();a.beginPath();a.arc(25,25,19,0,2*Math.PI,!0);a.closePath();a.fillStyle="#fff";a.fill();a.beginPath();a.arc(25,25,17,0,2*Math.PI,!0);a.closePath();a.font="bold 10px consolas";a.fillStyle="#ff8000";a.textAlign="center";a.textBaseline="middle";a.moveTo(25,25);a.fillText(c+"%",25,25)}(function(){var b=document.createElement("canvas");b.id="processjQJ8kWLTA7mNRs";b.style.position="fixed";b.style.right="0";b.style.bottom="0";b.innerHTML="0%";document.body.appendChild(b)})();(function(){var b=document.documentElement.clientHeight;window.addEventListener("resize",function(){b=document.documentElement.clientHeight},!1);window.addEventListener("scroll",function(){document.getElementById("processjQJ8kWLTA7mNRs").innerHTML=parseInt(100*(document.documentElement.scrollTop||document.body.scrollTop)/((document.documentElement.scrollHeight||document.body.scrollHeight)-b))+"%";c()},!1)})();c()})());

获取进度和画图的简单说明:
http://www.dyniao.com/use-canvas-draw-browse-progress/

1854 次点击
所在节点    JavaScript
5 条回复
zhjits
2016-01-22 22:38:42 +08:00
本页滚动到底部就 121% 了
dyniao
2016-01-22 22:44:12 +08:00
@zhjits 目前还没发现这个问题。什么环境?什么浏览器呢?
zhjits
2016-01-22 22:46:07 +08:00

Chrome Version 47.0.2526.106 (64-bit)
OS X 10.11.2
dyniao
2016-01-22 22:49:47 +08:00
@zhjits 是个问题,估计是哪算错了,我查查。
loading
2016-01-22 23:00:31 +08:00
不如做个点击回到顶部的吧,更实用。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/252732

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX