Windows XP Progress Bar Customization

[cr3ative]

Script: Windows XP Progress Bar (http://www.dynamicdrive.com/dynamicindex11/xpprogressbar.htm)

Hi everyone,

I currently have the progress bar installed at http://www.gerryhyh.f2s.com/paul/content/disarm.htm - when you click on a download link, the bar will show. This is pretty snazzy as it is, but I was wondering if and how I could make some text, like "Contacting mirror" appear at the same time the bar does (preferably just above the bar)?

cr3ative

[ddadmin]

That should be relatively simple to do, using a DIV tag to contain the text, and the "display" property to control its visiblity. Here's a complete example of this, using your HTML as the basis:


<script language="javascript" src="xp_progress.js">

/***********************************************
* WinXP Progress Bar- By Brian Gosselin- http://www.scriptasylum.com/
* Script featured on Dynamic Drive- http://www.dynamicdrive.com
* Please keep this notice intact
***********************************************/

</script>

<p><a href="../shared/afp.zip" onclick="showmybar();">Primary Download Host</a><br>
<a href="http://afpsupport.port5.com/shared/afp.zip" onclick="showmybar();">Secondary Download Host</a></p>

<script type="text/javascript">

// Bar placement. After 3 seconds, hide the bar again.
var bar2=createBar(320,13,'white',1,'silver','gainsboro',45,20,3,"javascript:hidemybar();");
bar2.hideBar();

function showmybar(){
bar2.showBar()
document.getElementById("progresstext").style.display="block"
}

function hidemybar(){
bar2.hideBar()
document.getElementById("progresstext").style.display="none"
}

</script>


<div id="progresstext" style="font: bold 12px Arial; display: none">Contacting mirror...</div>

Let me know if you have any questions. :)

[cr3ative]

That's muchly marvellous. Now my site looks mildly professional :p

Here it is in action:
www.afpsupport.r8.org/disarm.htm

cr3ative