Animated "Loading..Please Wait" Popup

[bdog4]

I've seen on some php forums that they use some type of popup box that
I assume is javascript to display a animated gif/flash when you do a
quick edit. My popup blocker does not detect it so I leads me to
believe it is javascript. Does anyone have an ideas on how I can do
this or an example/tutorial? They use it on Invision Power Boards

Thanks

[Nathan White]

You can do a Div popup window using Javascript to turn on/off the
display property of an element. Just make sure that the element that
your effecting has a zIndex higher then the document content so it
displays over it. Below I provided a simple example. You need to call
the javascript functions with some action but it should give you an
idea on how this is accomplished. The one thing this example does not
handle is where to positon the popup. If you want it to dynamically
center into the client's window you will need to add some more js. If
you decide to go that route you need to detect the window width/height
and the scrolls offsets and then get the render size of the object that
your turning on and do a bit of math to calculate where to position it.

Hope this helps.

<style>
#popup {
position: absolute;
display:none;
z-index: 100;
}
</style>
<script>
function showPopup(){
if( !document.getElementById ) return;
document.getElementById('popup').style.display = 'block';
}

function hidePopup(){
if( !document.getElementById ) return;
document.getElementById('popup').style.display = 'none';
}
</script>
<div id="popup"><img src="animated.gif"></div>

[bdog4]

Thanks Nathan for the lengthy reply. I'll take a look at what you have
and give it a shot.

[bdog4]

Well when I try and implement this on my upload page the animated gif
stops moving when the form is submitted. I guess it is because it is
loading down the processor doing the upload? Even if I just show the
animated gif by default on the page I get the same result. Any ideas
on how I can get around this? Thanks