用htc实现进度条控件

admin htc

2023-12-08 0 1,058

复制代码代码如下:<PUBLIC:COMPONENT> <PUBLIC:METHODNAME=\”Init\”INTERNALNAME=\”fnCreateProgressBar\”/> <PUBLIC:METHODNAME=\”showProgress\”INTERNALNAME=\”showProgress\”/> <PUBLIC:PROPERTYNAME=\”Container\”/> <PUBLIC:PROPERTYNAME=\”Speed\”/> <SCRIPTLANGUAGE=javascript> varstartTime=null; functionfnCreateProgressBar(){ now=newDate(); startTime=now.getTime(); now=null oContainer=element.Container oContainer.innerHTML=\”\”; oDiv=window.document.createElement(\”DIV\”) oDiv.className=\”progress\” oContainer.appendChild(oDiv) oDiv.style.display=\”\”; element.bar=oDiv; } functionpause(numberMillis){ vardialogScript= \’window.setTimeout(\’+ \’function(){window.close();},\’+numberMillis+\’);\’; varresult= window.showModalDialog( \’javascript:document.writeln(\’+ \’\”<script>\’+dialogScript+\'<\’+\’/script>\”)\’); } functionshowProgress(StatesDesc){ now=newDate(); currTime=now.getTime(); now=null if(StatesDesc!=null)window.status=StatesDesc+\”当前耗时:\”+(currTime-startTime)+\”毫秒!\”; element.bar.style.width=(currTime-startTime)/element.Speed; pause(1) } </script> </PUBLIC:COMPONENT>应用例子:复制代码代码如下:<html> <head> <metahttp-equiv=\”Content-Type\”content=\”text/html;charset=gb2312\”> <title>进度条测试</title> <linkrel=\”stylesheet\”type=\”text/css\”href=\”ProgressBar.css\”> <script> functionDemo(){ PrgBar.Container=document.all.layer1 PrgBar.Init(); for(vari=0;i<500;i++){ if(i%5==0)PrgBar.showProgress(\”操作进行中……\”) } PrgBar.showProgress(\”操作完成!\”) } </script> </head> <body> <divstyle=\”position:absolute;width:612px;height:19px;z-index:1;left:10px;top:72px;border-style:solid;border-width:1px;padding-left:4px;padding-right:4px;padding-top:1px;padding-bottom:1px\”id=\”layer1\”></div> <p><inputtype=\”button\”value=\”测试\”name=\”B3\”onclick=\”Demo()\”></p> <Progressbarid=\”PrgBar\”class=\”ProgressBar\”Speed=\”10\”/> </body> </html>样式文件:ProgressBar.css复制代码代码如下:.ProgressBar { BEHAVIOR:url(\”ProgressBar.htc\”) } .progress{ position:relative; width:0px; height:20px; z-index:1; background-color:#006699; filter:progid:DXImageTransform.Microsoft.gradient(startcolorstr=#006699,endcolorstr=#E3EFFF,gradientType=0); border:1pxridge#C0C0C0; }