网页加载进度条中的javascript

demo地址:

思路如下:代码都有注释,,就不一一介绍了。

==>.progress{position: fixed;top: 0;right: 0;left: 0;height: 20px;background: #f5f5f5;border-bottom: 1px solid #ddd;}.progress-inner{width: 1%;background: #abcdef;position: absolute;top: 0;left: 0;bottom: 0;}===></div><script>($progress = document.getElementById(‘progress’);// 初始进度,1%var progress = 1;{return Math.floor(Math.random() * (max – min + 1) + min);};{// 随机时间var timeout = random(10, 30);setTimeout((window.loaded){$progress.style.width = ‘100%’;return;}// 随机进度progress += random(1, 5);// 随机进度不能超过 98%,以免页面还没加载完毕,进度已经 100% 了if(progress > 98){progress = 98;}$progress.style.width = progress + ‘%’;onprogress();}, timeout);};// 开始跑进度onprogress();window.onload = function(){window.loaded = true;};})();=>==>=></html>

害怕攀登高峰的人,永远在山下徘徊。

网页加载进度条中的javascript

相关文章:

你感兴趣的文章:

标签云: