WullieJm Posted August 12, 2011 Share Posted August 12, 2011 have this simple gallery here http://dev.pixiders.com/sample/index.php I want to add a loader gif before the images untill they laod, i have tried hiding the images li and unhiding after load but it messed up the page because i just placed the loading image above the image. Gallery code <div id="gallery"> <ul> <?php $query_Recordset1 = mysql_query("SELECT * FROM property order by id DESC"); $i=1; while($del_row=mysql_fetch_array($query_Recordset1)){ ?> <li id="image"><span><?php echo $i; ?></span> <a href="property_details.php?id=<?php echo $del_row['id'];?>" class="nocolor"> <img src="images/property/<?php echo $del_row['image1']; ?>" height="435" alt="profile"/> </a> <div class="info"> <a href="property_details.php?id=<?php echo $del_row['id'];?>" class="nocolor"> <dl> <dt>Property Type : </dt> <dd><?php echo $clsproperty_type->get_type($del_row['type']);?></dd> <dt> Square Footage :</dt> <dd><?php echo $del_row['sq_ftage'];?></dd> <dt> Land Area:</dt> <dd><?php echo $del_row['land_area'];?></dd> <dt> Year :</dt> <dd><?php echo $del_row['yr_built'];?></dd> <dt> Baths:</dt> <dd><?php echo $del_row['baths'];?></dd> <dt> Beds:</dt> <dd><?php echo $del_row['bed_rooms'];?></dd> <dt> Price :</dt> <dd><?php echo number_format($del_row['price']);?></dd> <dt> Address:</dt> <dd><?php echo substr($del_row['address'],0,25);?></dd> </dl> read more</a> </div> </li> <?php $i++; } ?> </ul> </div> Can someone please help me with this? Link to comment https://forums.phpfreaks.com/topic/244653-loading-image-problem/ Share on other sites More sharing options...
nogray Posted August 13, 2011 Share Posted August 13, 2011 You would create a div around the image with the height and width of the image and set the background of that div to be the loading div (set it to no-repeat center center). In your image tag, set the style="display:none;" and add onload="this.style.display='';" That sould hide the images until they are loaded. Link to comment https://forums.phpfreaks.com/topic/244653-loading-image-problem/#findComment-1256708 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.