Interstitial Progress Bar

[anujgarg]

Hi,

 

I am trying to add an functionality in my website to open an Interstitial Progress Bar when I click on the submit button of my registration form.

 

I elaborate the problem:

I have a registration form which has many fields like first name, last name etc. After filling up the form, I need that the form should wait for some time before getting submitted and during that time, an Interstitial Progress Bar with percentage (0-100%) should appear.

 

How can I do it??

 

I used the code given in the dynamic drive:

http://www.dynamicdrive.com/dynamicindex17/interstitial.htm

and

http://www.javascriptbank.com/javascript/browser/page-effect/time-based-progress-bar/detail/

 

I tried to combine both of them but it did not work.

 

Any suggestions??

 

TIA

 

 

[ratcateme]

can you show us what you came up with

[ratcateme]

i created this

<table>
<tr>
	<td><img src="bar.png" id="img" width="1" height="15px"></td>
</tr>
</table>
<script type="text/javascript">
setTimeout('move_bar()',50);
function move_bar(){
bar = document.getElementById('img');
var width = bar.width;
var new_width = width+1;
bar.width = new_width;
if(new_width == 100){
	window.location = '0.php';
}
setTimeout('move_bar()',50);
}
</script>

that will create a progress bar that moves then redirects when it gets to 100%

 

Scott.

[anujgarg]

you can understand by this what I am getting:

 

On submitting the button, an interstitial opens without having progress bar into it. I just want to display the progress bar into it.

[kratsg]

Are you saying that the image itself is not displaying?

[anujgarg]

yes, nothing comes in the middle part of the interstitial.

 

Also, I need the interstitial to be closed automatically as soon as progress bar reaches 100%

[ratcateme]

well can you show some coed?

 

Scott.

[kratsg]

Here's where I'm getting slightly confused, I understand what you're trying to attempt, but it almost seems like you don't really need an image to do this for you.

 

I have an example which uses divs to show a progress bar of sorts (it's a health bar, but can be modified to suit your needs):

 

http://student.cse.fau.edu/~gstark1/javajock/health.php

 

This doesn't use an image, and the div width can be modified using javascript easily.