码迷,mamicode.com
首页 > Web开发 > 详细

通过js实现简单的图片延时加载

时间:2015-10-09 11:57:21      阅读:172      评论:0      收藏:0      [点我收藏+]

标签:

1.将要延迟加载的图片src属性全部改成thissrc

比如<img src="./top_img.jpg" />改成<img thissrc="./top_img.jpg" />

  <div class="topic-list">

<img thissrc="1.png" width="180" height="180" />

<img thissrc="2.png" width="180" height="180" />

<img thissrc="3.png" width="180" height="180" />

  </div>

2.在页面的最底部加入下面的script代码,比如这样。

<script type="text/javascript">

setTimeout("tosrc()", 1000); //延时加载

function tosrc() {
   imgs = $(‘.topic-list‘).find(‘img‘);
      imgsnum = imgs.length;
      for (imgi = 0; imgi < imgsnum; imgi++) {
          if ((typeof (imgs[imgi].src) == ‘undefined‘ || imgs[imgi].src == "") && imgs[imgi].getAttribute(‘thissrc‘) != null)
               imgs[imgi].src = imgs[imgi].getAttribute(‘thissrc‘);
            }
        }

</script>

通过js实现简单的图片延时加载

标签:

原文地址:http://www.cnblogs.com/YTzZ/p/4863390.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!