Tek-Tips is the largest IT community on the Internet today!
Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!
-
Congratulations TouchToneTommy on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!
OOO cant wait ALMOST THER!!!! 1
- Thread starter VspecGTR3
- Start date
-
1
- #2
here's one way:
first thing in your body will be a <div> to contain the bar.
then periodically throughout the html, add <script></script> tags to increment the bar.
=========================================================
if (!succeed) try();
-jeff
first thing in your body will be a <div> to contain the bar.
then periodically throughout the html, add <script></script> tags to increment the bar.
Code:
<html>
<head>
<title>progress bar</title>
<style type="text/css">
#progressContainer {
position:absolute;
left:25%;
top:25%;
width:50%;
border:2px outset threedface;
text-align:left;
}
#progressBar {
background-color:highlight;
border:1px solid highlight;
width:0%;
}
</style>
</head>
<body>
<div id="progressContainer">
Please wait...loading...
<div id="progressBar"></div>
</div>
<br/>
stuff...
<script language="javascript">
document.getElementById("progressBar").style.width = "25%";
for (x = 0; x< 1000000; x++) var foo = "bar";
</script>
<br/>
more stuff...
<script language="javascript">
document.getElementById("progressBar").style.width = "50%";
for (x = 0; x< 1000000; x++) var foo = "bar";
</script>
<br/>
still more stuff...
<script language="javascript">
document.getElementById("progressBar").style.width = "75%";
for (x = 0; x< 1000000; x++) var foo = "bar";
</script>
<br/>
even more stuff...
<script language="javascript">
document.getElementById("progressBar").style.width = "100%";
for (x = 0; x< 1000000; x++) var foo = "bar";
</script>
<br/>
done.
<script language="javascript">
document.getElementById("progressContainer").style.display = "none";
</script>
</body>
</html>if (!succeed) try();
-jeff
- Thread starter
- #3
- Status
Similar threads
