/*
Dynamic Progress Bar- By Dynamicdrive.com
For full source, Terms of service, and 100s DTHML scripts
Visit http://www.dynamicdrive.com
*/
//1) Set the duration for the progress bar to complete loading (in seconds)
var duration=5
//2) Set post action to carry out inside function below:
function postaction(){
//Example action could be to navigate to a URL, like following:
window.location="http://www.dynamicdrive.com"
}
///Done Editing/////////////
var clipright=0
var widthIE=0
var widthNS=0
function initializebar(){
if (document.all){
baranchor.style.visibility="visible"
widthIE=bar.style.pixelWidth
startIE=setInterval("increaseIE()",50)
}
if (document.layers){
widthNS=document.baranchorNS.document.barbackgroundNS.clip.width
document.baranchorNS.document.barNS.clip.right=0
document.baranchorNS.visibility="show"
startNS=setInterval("increaseNS()",50)
}
}
function increaseIE(){
bar.style.clip="rect(0 "+clipright+" auto 0)"
window.status="Loading..."
if (clipright<widthIE)
clipright=clipright+(widthIE/(duration*20))
else{
window.status=''
clearInterval(startIE)
postaction()
}
}
function increaseNS(){
if (clipright<202){
window.status="Loading..."
document.baranchorNS.document.barNS.clip.right=clipright
clipright=clipright+(widthNS/(duration*20))
}
else{
window.status=''
clearInterval(startNS)
postaction()
}
}
You have two javascript tags and the clossing comment tag is malformed and out of place, this did the trick for me when I tested it:
<script language="JavaScript1.2">
if (document.all){
divs= '<div id="baranchor" style="position:relative;width:200;height:20;visibility:hidden">'; note: this line should not be broken, the forum inserted this line break
divs+='<div id="barbackground" style="width:200;height:20;z-index:9"></div>';
divs+='<div id="bar" style="width:200;height:20;z-index:10"></div>';
document.write(divs+'</div>');
}
</script>
<ilayer name="baranchorNS" visibility="hide" width="200" height="20">
<layer name="barbackgroundNS" bgcolor="black" width="200" height="20" z-index="10" left="0" top="0"></layer>
<layer name="barNS" bgcolor="blue" width="200" height="20" z-index="11" left="0" top="0"></layer>
</ilayer>
</p>
John,
Thanks for the help — I now have the progress bar working, but I need to code the post action function and I can't get it to work. Upon completion of the bar, I would like a URL to open in a new window automatically with no user input necessary. Can you help me?
I believe I need to insert something into the following bit of code:
/*
Dynamic Progress Bar- By Dynamicdrive.com
For full source, Terms of service, and 100s DTHML scripts
Visit http://www.dynamicdrive.com
*/
//1) Set the duration for the progress bar to complete loading (in seconds)
var duration=5
//2) Set post action to carry out inside function below:
function postaction(){
//Example action could be to navigate to a URL, like following:
//window.location="http://www.dynamicdrive.com"
}
///Done Editing/////////////
var clipright=0
var widthIE=0
var widthNS=0
function initializebar(){
if (document.all){
baranchor.style.visibility="visible"
widthIE=bar.style.pixelWidth
startIE=setInterval("increaseIE()",50)
}
if (document.layers){
widthNS=document.baranchorNS.document.barbackgroundNS.clip.width
document.baranchorNS.document.barNS.clip.right=0
document.baranchorNS.visibility="show"
startNS=setInterval("increaseNS()",50)
}
}
function increaseIE(){
bar.style.clip="rect(0 "+clipright+" auto 0)"
window.status="Loading..."
if (clipright<widthIE)
clipright=clipright+(widthIE/(duration*20))
else{
window.status=''
clearInterval(startIE)
postaction()
}
}
function increaseNS(){
if (clipright<202){
window.status="Loading..."
document.baranchorNS.document.barNS.clip.right=clipright
clipright=clipright+(widthNS/(duration*20))
}
else{
window.status=''
clearInterval(startNS)
postaction()
}
}
window.onload=initializebar
</script>
Any help would be greatly appreciated!
Regards,
A3D
Try changing this:
//2) Set post action to carry out inside function below:
function postaction(){
//Example action could be to navigate to a URL, like following:
//window.location="http://www.dynamicdrive.com"
}
to this:
//2) Set post action to carry out inside function below:
function postaction(){
//Example action could be to navigate to a URL, like following:
window.location="http://www.dynamicdrive.com"
}
You need to uncomment the command to go to the new page.
John,
Thanks—that did it! I guess I need to learn at least the basics of JS and DHTML before I get any more scripts. Thanks for your replies and your expertise.