»
EnglishFrenchVietnamese

Print - WinXp Progress Bar - JavaScriptBank.com

Full version: jsB@nk » Misc » WinXp Progress Bar
URL: http://www.javascriptbank.com/winxp-progress-bar.html

WinXp Progress Bar © JavaScriptBank.comA great looking pure DHTML progress bar that resembles the one seen in Window XP's startup screen. All visual aspects of the bar can be customized, and the script can be invoked multiple times to display multiple bars on the same page. Script works in both IE5+ and NS6+.

Full version: jsB@nk » Misc » WinXp Progress Bar
URL: http://www.javascriptbank.com/winxp-progress-bar.html



JavaScript
<script language="javascript">// xp_progressbar// Copyright 2004 Brian Gosselin of ScriptAsylum.comvar w3c=(document.getElementById)?true:false;var ie=(document.all)?true:false;var N=-1;var bars=new Array();function createBar(w,h,bgc,brdW,brdC,blkC,speed,blocks){if(ie||w3c){var t='<div style="position:relative; overflow:hidden; width:'+w+'px; height:'+h+'px; background-color:'+bgc+'; border-color:'+brdC+'; border-width:'+brdW+'px; border-style:solid; font-size:1px;">';t+='<span id="blocks'+(++N)+'" style="left:-'+(h*2+1)+'px; position:absolute; font-size:1px">';for(i=0;i<blocks;i++){t+='<span style="background-color:'+blkC+'; left:-'+((h*i)+i)+'px; font-size:1px; position:absolute; width:'+h+'px; height:'+h+'px; 't+=(ie)?'filter:alpha(opacity='+(100-i*(100/blocks))+')':'-Moz-opacity:'+((100-i*(100/blocks))/100);t+='"></span>';}t+='</span></div>';document.write(t);var bA=(ie)?document.all['blocks'+N]:document.getElementById('blocks'+N);bA.blocks=blocks;bA.w=w;bA.h=h;bars[bars.length]=bA;setInterval('startBar('+N+')',speed);}}function startBar(bn){var t=bars[bn];t.style.left=((parseInt(t.style.left)+t.h+1-(t.blocks*t.h+t.blocks)>t.w)? -(t.h*2+1) : parseInt(t.style.left)+t.h+1)+'px';}</script><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<SCRIPT type=text/javascript>createBar(300,15,'white',1,'black','blue',85,7);</SCRIPT><br><SCRIPT type=text/javascript>createBar(300,15,'white',1,'black','green',85,7);</SCRIPT><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->