 |
|
|
Search this site!
|
 |
 |
|
Open up your CD drive! | Page Counters | Convert WORD document | Download Counter | Form Mailer1 | Form Mailer2 | Display special characters | Display subscript & superscripts | Random Password Generator | Progress Bar Generator
|
Progress Bar Generator
|
Description:
|
Here's one way to display a progress bar. I found it at the Javascript web site.
|
|
How to use:
|
Simply copy and paste the code at the end of this page onto your CSB page using the Insert > HTML Code function.
|
|
Example:
|
|
|
Download the code
right click on link, then click on 'Save target (or frame) as'
|
|
|
Other information:
|
|
Source code:
<table align="center"><tr><td>
<div style="font-size:8pt;padding:2px;border:solid black 1px">
<span id="progress1"> </span>
<span id="progress2"> </span>
<span id="progress3"> </span>
<span id="progress4"> </span>
<span id="progress5"> </span>
<span id="progress6"> </span>
<span id="progress7"> </span>
<span id="progress8"> </span>
<span id="progress9"> </span>
</div>
</td></tr></table>
<script language="javascript">
var progressEnd = 9; // set to number of progress <span>'s.
var progressColor = 'blue'; // set to progress bar color
var progressInterval = 1000; // set to time between updates (milli-seconds)
var progressAt = progressEnd;
var progressTimer;
function progress_clear() {
for (var i = 1; i <= progressEnd; i++) document.getElementById('progress'+i).style.backgroundColor = 'transparent';
progressAt = 0;
}
function progress_update() {
progressAt++;
if (progressAt > progressEnd) progress_clear();
else document.getElementById('progress'+progressAt).style.backgroundColor = progressColor;
progressTimer = setTimeout('progress_update()',progressInterval);
}
function progress_stop() {
clearTimeout(progressTimer);
progress_clear();
}
progress_update(); // start progress bar
</script>
<p><center>
<font face="arial, helvetica" size"-2">Free JavaScripts provided<br>
by <a href="http://javascriptsource.com">The JavaScript Source</a></font>
</center><p>
|