哈哈哈新上好菜-懒加载

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/Bepthslowly/article/details/88592420

 1、HTML

  <div class="site-demo-flow" id="LAY_demo3">
    <img lay-src="https://gw.alicdn.com/bao/uploaded/i2/701696736/TB2PNl5ahQa61Bjy0FhXXaalFXa_!!701696736.jpg_400x400q90.jpg?t=1552699330043">
    <img lay-src="https://gw.alicdn.com/bao/uploaded/i2/162734861/TB2V5rsX_gc61BjSZFkXXcTkFXa_!!162734861.jpg_400x400q90.jpg?t=1552699330043">
  </div>

 2、CSS

  <script src="/layui/layui.js"></script>
  <script>
    function showValue(obj){
      var timestamp = new Date(obj.value).getTime();
      console.log(timestamp)
    }
    //懒加载
    layui.use('flow', function(){
      var flow = layui.flow;
      //按屏加载图片
      flow.lazyimg({
        elem: '#LAY_demo3 img'
//        ,scrollElem: '#LAY_demo3' //一般不用设置，此处只是演示需要。
      });
    });
  </script>

3、原理及优势