您的位置：首页 > 其它

环形进度条--插件--转载

2015-08-14 16:46 288 查看

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>circleProgress using Canvas</title>
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
<style>
tr.circle {
text-align: center;
}
</style>
<script type="text/javascript" src="circleProgress.js"></script>
</head>
<body>
<a href="#" onclick="showMe();">Show me!</a>
<table>
<tr>
<td>
<canvas id="circle-progress-custom" width="200" height="200"></canvas>
</td>
</tr>
</table>
<script type="text/javascript">
var showMe = function () {
circleProgress({
id: 'circle-progress-custom',
progress: 63.5, // default: 100
duration: 2000, // default: 1000
color: 'green', // default: 'rgb(52, 145, 204)'
bgColor: '#ccc', // default: 'rgb(230, 230, 230)'
textColor: 'green', // default: 'black'
progressWidth: 0.15, // default: 0.25 (r)
fontScale: 0.5, // default: 0.4 (r)
toFixed: 1  // default: 0
});
};
showMe();
</script>
</body>
</html>

View Code

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航