Jump to content

[SOLVED] show loading image before the whole page gets load


deepson2

Recommended Posts

Hello,

 

how can we show the image before the page is getting fully load.

 

something like page is loading. basically i want to show loading image before my whole fetched data's not come or load on that page.

 

can anyone here tell me how can i do that?

 

thanks in advance

actually the following code is working. but it showing the images as well who are getting loaded. here is my code

 

<?if(!$userid){?>
<body id="free" onload="document.getElementById('lbar').style.display = 'none';">
<?}else{?>
<body onload="document.getElementById('lbar').style.display = 'none';"><?}?>

<div id="lbar">
<img src="<?=$retpath;?>/images/ajax-loader.gif" width="30" height="39" alt="City" />
</div>
// and this is my left container which should be shown after it geeting loaded fully
<div id="main-content">
<div class="left">

<div class="recentnessText">
<span><img src="images/icon_recentness.gif" width="20" height="16" alt="Icon - Recentness" /></span><h2>Recentness</h2></div>

<div id="blogSnaps">
<div class="snap1"><a href="/blogs/<?=$ids[$arr[0]];?>/" title="<?=$img[$arr[0]];?>"><img src="<?=$imagepath[0];?>" width="143" height="107" border="0" alt="<?=$img[$arr[0]];?>" /></a></div>
<div class="snap1"><a href="/blogs/<?=$ids[$arr[1]];?>/" title="<?=$img[$arr[1]];?>"><img src="<?=$imagepath[1];?>" width="143" height="107" border="0" alt="<?=$img[$arr[1]];?>" /></a></div>
<div class="snap1"><a href="/blogs/<?=$ids[$arr[2]];?>/" title="<?=$img[$arr[2]];?>"><img src="<?=$imagepath[2];?>" width="143" height="107" border="0" alt="<?=$img[$arr[2]];?>" /></a></div>
</div>
</div>

 

can anyone tell me how can i show only loading image only before my page is getting fully loaded?

Thanks for the much awaited reply!

 

They have shown how the page is loading and then showing the page actually. for me i want to show this loading image until data is getting fetched from database. but now its showing me both simoultenously.

 

could you please tell me how can i show the only loading image before the actual page content gets loaded fully?

 

like this site

 

blogged.com

 

please help me 

Solved my problem.

 

just made changes with the help of other forums.

 

like this

 

<body onload="document.getElementById('lbar').style.display = 'none';document.getElementById('main-content').style.display = 'block';">

and
<div id="main-content" style="display:none">

 

Hope this will help someone who is really looking for it.  :)

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.