html5 progress
2016-07-21 22:27
573 查看
<!doctype html> <html> <head> <title>progress</title> <script type="text/javascript" src="javascript/jquery.js"></script> <script type="text/javascript"> var currentValue = 0;//进度条当前数据 var maxValue = 100;//进度条最大值 var myIndex; $(function () { $('#myProgress').val(currentValue); $('#myProgress').attr('max', maxValue); myIndex = setInterval(plusValue, 100); }); function plusValue() { if (currentValue < maxValue) { currentValue++; $('#myProgress').val(currentValue); } else { clearInterval(myIndex); alert('加载完成'); } } </script> </head> <body> <progress id="myProgress" ></progress> </body> </html>
相关文章推荐
- HTML5中在客户端验证文件上传的大小
- html5 web数据存储
- 页面元素查找之Selectors API
- 使用ajax实现用户登录验证(升级版)
- Canvas 在高清屏下绘制图片变模糊的解决方法
- 关于前端的思考与感悟
- 新时代编辑神器:Atom
- rem : web app适配的秘密武器
- jquery高级应用之Deferred对象
- 又被事件冒泡坑了一把,这次要彻底弄懂浏览器的事件流
- 移动端点击事件全攻略,这里的坑你知多少?
- $q 实例分析 Angular 中的 Promise
- 浏览器中唤起native app || 跳转到应用商城下载
- Angular directive 实例详解
- 关于浮动与清除浮动,你应该知道的
- 数组reduce方法的高级技巧
- 原生js结合html5制作小飞龙的简易跳球
- HTML5游戏引擎LTweenLite实现的超帅动画效果(附demo源码下载)