Check out some similar questions!

afagh · Feb 26, 2010, 11:11 PM

Hi I have a website that it has several pages in iframe and till they loaded , it takes long time, so I want showe something such as progress bar or other things till all pages loaded, I'll apritiate if you can help me.
afagh.

objectundefined · Feb 28, 2010, 02:32 PM

There's a pretty easy way to get that done. First off, the hacky way: Fire off a script at the end of your child documents.

For instance:

Code:

<html>
<head>
</head>
<body></body>
</html>
<script>
parent.hideProgressIndicator();
</script>

Then, in your parent document you'd reference the function hideProgressIndicator(), with which you'd set the progress indicator (usually an animated GIF) to 'display:none' and the iframe to 'display:block'...

Now the jQuery way using a callback:

Code:


    $(document.body).append('<IFRAME id="myId" style="display:none">');
    $('iframe#myId').attr('src', url);

    $('iframe#myId').load(function() 
    {

   $('#progress_img').hide();
   $('iframe#myId').show()
    });