这里有新鲜出炉的 Javascript 教程,程序狗速度看过来!
Javascript 是一种由 Netscape 的 LiveScript 发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如 Perl,遗留的速度问题,为客户提供更流畅的浏览效果。
这篇文章主要介绍了 javascript 网页进度条简单实例的相关资料, 需要的朋友可以参考下
javascript 网页进度条简单实例
最近学习新的知识,遇到一个小功能网页进度条,发现一篇文章还是不错的,这里记录下,也许能帮助到大家,
实例代码:
- <!DOCTYPE html>
- <html>
- <head>
- <style>
- #box {float:left;width:100%;height:18px;border:1px solid;} #bar {float:left;width:100%;height:18px;border:0px;background:#00f;}
- </style>
- </head>
- <body>
- <div id="box">
- <div id="bar">
- </div>
- </div>
- <script language="javascript">
- var total = 6480; //总数
- var curN = 4480; //当前值
- function show() {
- var box = document.getElementById("box");
- var o = document.getElementById("bar");
- o.style.width = ((curN / total) * 200) + 'px'; //200是外框的宽度
- }
- show();
- </script>
- </body>
- </html>
取反:
- <!DOCTYPE html>
- <html>
- <head>
- <style>
- #box {float:left;width:200px;height:18px;border:1px solid;} #bar {float:left;width:100%;height:18px;border:0px;background:#00f;}
- </style>
- </head>
- <body>
- <div id="box">
- <div id="bar">
- </div>
- </div>
- <script language="javascript">
- var total = 6480; //总数
- var curN = 6400; //当前值
- var baseNub = total - curN;
- function show() {
- var box = document.getElementById("box");
- var o = document.getElementById("bar");
- o.style.width = ((baseNub / total) * 200) + 'px'; //200是外框的宽度
- }
- show();
- </script>
- </body>
- </html>
来源: http://www.phperz.com/article/17/0513/327357.html