JavaScript实现图片延迟加载
01 / 05 / 2010 admin

主要是利用javascript中Image对象,判断图片是否加载完成,然后载入图片,有两种方法可以判断
第一种是使用onload事件,比如:

<script type=”text/javascript”>
 var obj = new Image();
 obj.src = “yourpicurl.jpg”;
 obj.onload = function(){
  document.getElementById(”pic”).childNodes[0].src = this.src;
 }
</script>
<div id=”pic”><img src=”loading.gif” /></div>

第二种方法是使用onreadystatechange来判断

<script type=”text/javascript”>
 var obj = new Image();
 obj.src = “yourpicurl.jpg”;
 obj.onreadystatechange = function(){
  if ( this.readyState == “complete”){
   document.getElementById(”pic”).childNodes[0].src = this.src;
  }
 }
</script>
<div id=”pic”><img src=”loading.gif” /></div>