469,352 Members | 1,708 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,352 developers. It's quick & easy.

Animated "Loading..Please Wait" Popup

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

Jan 31 '06 #1
3 25033
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>

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

Jan 31 '06 #3
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

Feb 1 '06 #4

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

3 posts views Thread by Kannan | last post: by
1 post views Thread by Paul | last post: by
2 posts views Thread by dana lees | last post: by
2 posts views Thread by =?Utf-8?B?Z2VvZmZh?= | last post: by
1 post views Thread by =?Utf-8?B?Sm9obiBXYWxrZXI=?= | last post: by
1 post views Thread by =?Utf-8?B?QWxoYW1icmEgRWlkb3MgS2lxdWVuZXQ=?= | last post: by
reply views Thread by zhoujie | last post: by
reply views Thread by suresh191 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.