javascript - 在加载主图像时加载图像

Question

我有一个电子商务网站，当我获取页面上的所有产品时。但所有图像都非常高。我想要加载主图像，直到加载图像显示给用户。谢谢

$sqlpro="select * from tbl_product $where";
$respro=mysql_query($sqlpro);
$totalproduct=mysql_num_rows($respro);  
if($totalproduct>0)
  {
      while($rowpro=mysql_fetch_array($respro))
     {
 <a href="saree?id=<?php echo base64_encode($rowpro['pro_unickid'])?>">
     <img src="ajax_loader-2.gif" id="loding_image<?php echo $rowpro['pro_unickid']?>"  />
      <img src="admin/<?php echo $rowpro['thumbimage1']; ?>" id="image_of_product<?php echo $rowpro['pro_unickid']?>"  
                    onmouseover="this.src='admin/<?php echo $rowpro['thumbimage2']; ?>',imagehidesaree('left<?php echo $rowpro['pro_unickid']?>','right<?php echo $rowpro['pro_unickid']?>','bottom<?php echo $rowpro['pro_unickid']?>');"
                    onmouseout="this.src='admin/<?php echo $rowpro['thumbimage1']; ?>',imagemouseout('left<?php echo $rowpro['pro_unickid']?>','right<?php echo $rowpro['pro_unickid']?>','bottom<?php echo $rowpro['pro_unickid']?>');"
                    width="243" height="359"   />
                    </a>
}
}

Answer 1

<img style="background:url('ajax_loader-2.gif') no-repeat center;" src="admin/<?php echo $rowpro['thumbimage1']; ?>" id="image_of_product<?php echo $rowpro['pro_unickid']?>" onmouseover="this.src='admin/<?php echo $rowpro['thumbimage2']; ?>',imagehidesaree('left<?php echo $rowpro['pro_unickid']?>','right<?php echo $rowpro['pro_unickid']?>','bottom<?php echo $rowpro['pro_unickid']?>');" onmouseout="this.src='admin/<?php echo $rowpro['thumbimage1']; ?>',imagemouseout('left<?php echo $rowpro['pro_unickid']?>','right<?php echo $rowpro['pro_unickid']?>','bottom<?php echo $rowpro['pro_unickid']?>');" width="243" height="359"   />

如何将加载器图像设置为 img 元素背景。