1 <html> 2 <head> 3 <title>落日赌城</title> 4 </head> 5 <body> 6 </body> 7 <script type="text/jscript"> 8 function DoubleAnimation(target,targetProperty,from,to,Duration) 9 { 10 this.Begin=function anonymous() 11 { 12 target[targetProperty]=from; 13 var starttime=new Date(); 14 setTimeout(StoryBoard(),1); 15 function StoryBoard() 16 { 17 return function() 18 { 19 var now=new Date(); 20 var d=now.getTime()-starttime.getTime(); 21 target[targetProperty]=Math.round(from+(to-from)*d/Duration); 22 if(d<Duration)setTimeout(StoryBoard(),10); 23 } 24 } 25 } 26 this.setTo=function(val){to=val;} 27 this.setFrom=function(val){from=val;} 28 } 29 function ProgressBar(ID) 30 { 31 document.write( "<div id=\""+ID+"\" style=\"position:absolute;top:199;100; left: 108px;\"><image src=\"/images/20110805/pb_empty.jpg\" style=\"position: absolute;left: 84px; top: 137px;\" /><div id=\""+ID+"pb\" style=\"position: absolute; left: 106px; top: 143px;z-index:5;overflow:hidden;130;\" ><img src=\"/images/20110805/pb_full3.jpg\"/><div id=\""+ID+"highlight\" style=\"background:#ffffff;left: -500px; position: absolute; top: -1px;100;height:20;filter:Alpha(Opacity=75,FinishOpacity=0,Style=2)\"></div></div><div style=\"position:absolute;top:83px;180px; left: 148px;\">加载中请稍候……</div></div>"); 32 document.write("<div id='light' style=\"position: absolute;height:10;20;left:1000;top:334;background:#aaccff;filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='10')progid:DXImageTransform.Microsoft.Alpha(opacity=50);\"></div>"); 33 var story=new DoubleAnimation(document.getElementById(ID+"highlight").style,"left",-100,324,2000) 34 this.set=function(percentage) 35 { 36 document.getElementById(ID+"pb").style.width=Math.round(percentage*410/100); 37 document.getElementById("light").style.left=Math.round(percentage*410/100)+194; 38 document.getElementById("light").filters[1].opacity=percentage%100; 39 } 40 } 41 //演示 42 var pb1=new ProgressBar("ok"); 43 var p=0; 44 function loading() 45 { 46 pb1.set(p+=0.1); 47 if(p<100)setTimeout(loading,10); 48 } 49 50 loading() 51 </script> 52 <br /> 54 </html>