Vml+Dhtml:制作一个应用渐变颜色效果不错的进度条

王朝html/css/js·作者佚名  2006-01-08
宽屏版  字体: |||超大  

<HTML xmlns:v>

<HEAD>

<META http-equiv='Content-Type' content='text/html;charset=gb2312'>

<Meta name='Gemeratpr' content='网络程序员伴侣(Lshdic)2004'>

<TITLE>效果不错的VML进度条</TITLE>

<STYLE>

v\:*{behavior:url(#default#VML);}

*{font-size:12px;color:;}

</STYLE>

</HEAD>

<BODY topmargin='2' leftmargin='2'>

<div style='table-Layout:fixed;width:100%;height:100%;border:1 solid black'>

<v:RoundRect id='a' style='position:absolute;left:300;top:250;height:29;'>

<v:Textbox inset='5px,5px,5px'><b><font color='red' id='jindu'></font></b></v:textbox>

<v:fill type='gradient' id='fill1' color='blue'/>

</v:RoundRect>

</div>

<script>

//原作:风云舞,载自:http://www.lshdic.com/bbs

var pos1=1,posall=200 //定义全局变量,pos1为当前进度,posall为总进度

function play1(){ //播放函数

if(pos1<posall)pos1+=1;else{pos1=1;fill1.color="rgb("+Math.round(Math.random()*255)+","+Math.round(Math.random()*255)+","+Math.round(Math.random()*255)+")"}

a.style.width=Math.round(300/(posall/pos1));jindu.innerText=pos1+"/"+posall+","+Math.round(100/(posall/pos1))+"%"

fill1.angle=Math.round(300/(posall/pos1))

}

setInterval("play1()",10) //10毫秒播放一次,一般CPU保证能消化~~~

</script>

</BODY>

</HTML>

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
© 2005- 王朝网络 版权所有