教程集 www.jiaochengji.com
Golang 教程
教程集 >  脚本编程  >  javascript  >  正文 javascript中Loading进度条的网页加载效果

javascript中Loading进度条的网页加载效果

发布时间：2016-10-29   编辑：jiaochengji.com
教程集为您提供javascript中Loading进度条的网页加载效果等资源，欢迎您收藏本站，我们将为您提供最新的javascript中Loading进度条的网页加载效果资源
JavaScript实现网页上常见的Loading效果，本款加载特效更像是windows XP启动时候的进度条效果，左右来回跑动的彩带，并显示文字提示，程序正在加载中……，代码简洁实用，复制代码到你的网页中即可实现进度条效果。
提示：您可以先修改部分代码再运行

<textarea name="runcool" rows="28" cols="75" > <html> <head> <title>程序加载页面</title> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> </head> <body style="background:black">
正在加载中......
<script language="JavaScript"> s=new Array("#050626","#0a0b44","#0f1165","#1a1d95","#1c1fa7","#1c20c8","#060cff"); //s=new Array("#333333","#555555","#777777","#999999","#AAAAAA","#CCCCCC","#EEEEEE"); div1.style.posTop=Math.floor((document.body.clientHeight-14)/2); div1.style.posLeft=Math.floor((document.body.clientWidth-322)/2); div2.style.posTop=parseInt(div1.style.posTop) 20; div2.style.posLeft=parseInt(div1.style.posLeft) 120; function Larrange(){ pimg.innerHTML=""; for(i=0;i<9;i ){ pimg.innerHTML ="-1;i--){ pimg.innerHTML =""; } } var is=0;size=0; function move(){ if(pimg.style.pixelLeft<350&&is==0){ if(size==0){Larrange();size=1;} pimg.style.pixelLeft =3; setTimeout("move()",1); return; } is=1; if(pimg.style.pixelLeft>-200&&is==1){ if(size==1){Rarrange();size=0;} pimg.style.pixelLeft-=3; setTimeout("move()",1); return; } is=0; move(); } function flashs(){ if(div2.style.color=="#ffffff"){ div2.style.color="#707888"; setTimeout('flashs()',500); } else{ div2.style.color="#ffffff"; setTimeout('flashs()',500); } } Larrange(); flashs(); move(); </script> </body> </html></textarea>
提示：您可以先修改部分代码再运行

您可能感兴趣的文章：
jQuery 页面载入进度条实现代码
6款新颖的jQuery和CSS3进度条插件推荐
网页或文件加载Loading进度条效果
javascript中Loading进度条的网页加载效果
基于jquery的loading效果实现代码
jquery 简单的进度条实现代码
用jQuery模拟页面加载进度条的实现代码
分享8款优秀的 jQuery 加载动画和进度条插件
jQuery插件 LoadMask
基于jQuery实现模拟页面加载进度条

上一篇：js实现网页飞入星星的效果 下一篇：兼容多浏览器js给元素添加样式css
[关闭]
最近更新
浏览排行

关于本站 | 网站地图 | 联系我们 | 免责声明 | 友情链接
京ICP备12039225号-6 广告合作请加QQ:441358019
CopyRight © 2010-2014 教程集 jiaochengji.com , All Rights Reserved.

~ ~