摘要：模块最终使用方法进行查找并自动添加为查找。百分比文字样式非必填默认。百分比文字大小会通过的值自动计算百分数的数字并添加百分号。百分比文字现实的颜色。
原文链接 使用
引入文件:
./build/js/iantooPercent.js
并在页面执行
该模块不依赖任何三方模块，并于iantoo系列其它功能可同时存在。 兼容性所有支持canvas的浏览器均支持该模块可以参考canvas基本支持属性
预览iantooPercent
Github API elcanvas对应的ID名称,必填。
模块最终使用querySelector方法进行DOM 查找,并自动添加#为id查找。line指边线,也就是背景中的整圆。
line.size
非必填、number,默认:4边线的粗细。
line.color
非必填、string,默认:"#D3EDFD"，十六进制颜色值。边线的颜色。
subject主要旋转部分的样式设置
subject.size
非必填、number,默认:8。旋转主线条的粗细。
subject.color
非必填、string,默认:"#57C0FD"，十六进制颜色值。旋转的主线条的颜色。
subject.Start_Position
非必填、number,默认:0，取值:0,1,2,3。制旋转主线条的开始位置，取值:0,1,2,3 ;按照时钟的时间说明 0代表从00点钟方向开始; 1代表是3点钟方向,依此类推 。
subject.percentage
非必填、number,默认:0，取值:0～1。旋转的百分比，取值在0～1之间，如果浮点数在小数点后三位的数，不会进行四舍五入，而是通过直接取小数点后面两位数为准。
subject.content
非必填、string,默认:"附加文字"除显示百分比数字以外，的附加内容显示文字，将显示在百分比内容下面，此处并未对传入字符长度做限制。
perStyle百分比文字样式
perStyle.fontSize
非必填、number,默认:30。百分比文字大小,会通过subject.percentage的值自动计算百分数的数字并添加百分号。
perStyle.color
非必填、string,默认:"#EF5A3C"。百分比文字现实的颜色。
contentStyle.附加内容的样式
contentStyle.fontSize
非必填、number,默认:16。附加文字内容显示的字体大小
contentStyle.color
非必填、string,默认:"#77828C"。附加内容的文字颜色。
注：该模块必须对canvas标签设置style的宽高属性，或者通过class属性指定宽高。源码中会通过获取canvas的offsetWidth和offsetHeight去重新设置canvas的width和height属性，但这并不影响自身style属性下所对应显示的大小。
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/108108.html
摘要：前提有时候在项目中会有用到进度条的情况，使用也可以实现，但是对于性能不好的设备，或者网络不好的情况下，卡顿现象非常明显，避免出现不流畅的尴尬情况，所以记录一下，使用来实现的方法。 前提：有时候在项目中会有用到进度条的情况，使用css3也可以实现，但是对于性能不好的设备，或者网络不好的情况下，卡顿现象非常明显，避免出现不流畅的尴尬情况，所以记录一下，使用canvas来实现的方法。 效果图...
摘要：前提有时候在项目中会有用到进度条的情况，使用也可以实现，但是对于性能不好的设备，或者网络不好的情况下，卡顿现象非常明显，避免出现不流畅的尴尬情况，所以记录一下，使用来实现的方法。 前提：有时候在项目中会有用到进度条的情况，使用css3也可以实现，但是对于性能不好的设备，或者网络不好的情况下，卡顿现象非常明显，避免出现不流畅的尴尬情况，所以记录一下，使用canvas来实现的方法。 效果图...
摘要：参考环形路径平移的方案，做一些调整，就可以得到型路径平移的写法这里初始把元素放在了上面那个半圆环的圆心，然后在的关键帧位置切换为下面的半圆环路径。 最近在CSS Secrets一书看到了这样一节：让一个元素沿环形路径平移。这是一个css动画的问题，但却没有看上去那么简单，其关键点是元素是平移的，也就是说，元素自身并不发生旋转，只是稳定地沿着一个环形的路径移动，像这样： showImg(...
阅读 609·2021-11-08 13:22
阅读 2737·2021-09-29 09:45
阅读 2653·2021-09-09 11:52
阅读 2140·2019-08-30 13:20
阅读 3574·2019-08-29 13:28
阅读 1224·2019-08-29 12:32
阅读 2405·2019-08-29 11:10
阅读 1514·2019-08-26 13:34
