JQuery做的进度条

最新推荐文章于 2023-09-27 09:27:03 发布

shenzhw0000

最新推荐文章于 2023-09-27 09:27:03 发布

阅读量156

点赞数

CC 4.0 BY-SA版权

文章标签： jQuery HTML ViewUI

本文链接：https://blog.youkuaiyun.com/shenzhw0000/article/details/83742215

因项目需要，用JQuery作了个进度条，原理很简单。


<html>
	<head>
		<link rel="stylesheet" type="text/css" href="../themes/default/easyui.css">
		<link rel="stylesheet" type="text/css" href="../themes/icon.css">
		<style type="text/css">
			#loading{
				width:100px;
				height:10px;
				background:#A0DB0E;
				position:fixed;
				left:0;
				top:0;
				border:1px solid black;
			}
			#loading div{
				width:1px;
				height:10px;
				background:#F1FF4D;
				font-size:5px;
			}
		</style>
		<script type="text/javascript" src="../jquery-1.4.2.min.js"></script>
		<script type="text/javascript" src="../jquery.easyui.min.js"></script>
		<script type="text/javascript">
			$(function(){
				$('#loading div').animate({width:"85px"});
			});
		</script>
	</head>
	<body>
		<div id="loading"><div><span>16%</span></div></div>
	</body>
</html>