之前寫的 cpbBuilder.js 完全是覺得好玩兒,沒有實際使用,上個星期自己在項目上使用了一些,覺得有些東西用起來并不是很舒坦,主要就是每個進度條的設定,要統一在 JS 中去設定,這樣在修改的時候不是很直覺,不過好處是可以使用 JS 配合 JSON,第二個版本在 canvas 标簽中使用了 data-* 屬性,也就是圖個友善,至于具體使用哪個版本可以自己根據需要選擇,代碼是完全開源的,可以随便用,随便改。
王世傑:純JS環形進度條生成插件zhuanlan.zhihu.com
插件代碼:
// cpbBuilder.js
使用:
<!-- 建立 canvas 元素 -->
插件執行個體化和設定:
// usage
插件運作:
// 因為參數是在元素 data-* 屬性中設定的,是以可以周遊元素運作
更多用法請自由發揮!