asked on

load processing image before showing form

Hi experts,

I have a html file with form and i need to hide the form when the file is accessed for few seconds while showing a processing image. Please help.

Thanks

gavsmith

Do you mean something like:

<html>
<head>
<script type="text/javascript">
showForm(){
document.getElementById("LoadingImage").style.display="none";  
document.getElementById("MyForm").style.display="block";
  }
</script>
</head>
<body onload="setTimeout('showForm()', 5000);">
<img id="LoadingImage" src="images/loadingimage.gif">
<form id="MyForm" style="display:none">
<input/>blah blah...
</form>
</body>
</html>

Open in new window

gloriaewold41

ASKER

It's not working gavsmith. It loads the image and doesn't change. Please correct it, i really need it. I don't know if it's important but i have two forms in my page, one it's a search form. And in the left of the signup form i have a menu which i don't want to hide while image is loading.

dimmergeek

At top of HTML page....

<div id="status" width="100%" style="margin-top:15%;">
        <center>
            <p>Inserting record....please wait.</p>
            <img src="Images/waiting.gif" alt="" />
        </center>
    </div>

Open in new window

at bottom of page....

<script language="javascript">
        document.getElementById('status').style.display = 'none';
    </script>

Open in new window

gavsmith

sorry i missed one bit...

line 4 should have been:

function showForm(){

instead of:

showForm(){

Let me know if that doesn't work.

ASKER CERTIFIED SOLUTION

gavsmith

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

gavsmith

Your menu doesn't need to be within <form></form> if it is, it will also be hidden, if it isn't it won't be! Use a little css to place the loading image where you want it.

gloriaewold41

ASKER

gavsmith your code works but not in my page. I followed the exact order like in your code but i can't get it to work. Why doesn't it load the script?

gloriaewold41

ASKER

I got it. Instead of body onload i've added

<script type="text/javascript">
window.onload = function() {
setTimeout('showForm()', 5000);
}
</script>

and it works. Thanks