jQuery圆角渐变进度条特效

来源:https://www.sucaihuo.com/js/4782.html 2019-09-26 12:03浏览(161) 收藏

一款简单实用的jQuery圆角渐变进度条特效,默认是黄色和橙色渐变,可自定义渐变色值,可设置进度条显示动画。
jQuery圆角渐变进度条特效
分类:css3 > 进度条 难易:初级
查看演示 下载资源: 6 下载资源 下载积分: 20 积分

js代码

<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="js/progress.js"></script>
	<script type="text/javascript">
		$('#progress-container').initData({
			height: 10,
			percent: 0
		})
		var mPercent = 0
		setInterval(function(){
			if (mPercent >= 100) {
				mPercent = 0
			}
			mPercent = (mPercent * 10 + 1) / 10
			mAutoPlay($('#progress-container'), mPercent, { height: 10 })
		}, 20)
		$('#progress-container1').initData({
			height: 10,
			percent: 100,
			bgStartColor: 'green',
			bgEndColor: 'red'
		})
		$('#progress-container2').initData({
			height: 6,
			percent: 80,
			isAuto: true
		})
		$('#progress-container3').initData({
			height: 10,
			percent: 75,
			bgStartColor: '#1989fa',
			bgEndColor: '#1989fa'
		})
	</script>
评论0
头像

系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791

1 2