zoukankan      html  css  js  c++  java
  • 图片延时加载

    //js
    <script> var imgs = document.getElementsByTagName("img"); function lazyload(){ var scrollTop = window.pageXOffset || document.documentElement.scrollTop || document.body.scrollTop; var viewportSize = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight; for(var i=0,len=imgs.length;i<len;i++){ var x = scrollTop + viewportSize - imgs[i].offsetTop; if(x>0){ imgs[i].src = imgs[i].getAttribute("data-src"); } } } setInterval(lazyload,1000); </script>

    //jquery <script type="text/javascript"> $(function(){ var viewportSize = $(window).height(); var lazyload = function(){ var scrollTop = $(window).scrollTop(); $("img").each(function(){ var _this = $(this); var x = viewportSize + scrollTop - _this.offset().top; if(x>0){ _this.attr("src",_this.attr("data-src")); } }) } setInterval(lazyload,100); }) </script>


    //改进

    $(function(){
      function aa(){
        var winH = $(window).height();
        var scrollTop = $(window).scrollTop();
        $("img").each(function(){
          var imgTop = $(this).offset().top;
          if(imgTop<winH+scrollTop){
            $(this).attr("src",$(this).attr("data-src"));
          }
        })
      }
      aa();
      $(window).scroll(function(){
        setTimeout( aa,1000)
      });
    })

  • 相关阅读:
    redis client 2.0.0 pipeline 的list的rpop bug
    Python解释器镜像源修改
    全连接层
    测试(张量)- 实战
    数据加载
    Python之微信-微信好友头像合成
    高阶操作
    MYSQL 查询缓存
    SQL Server 查看指定表上的索引
    MYSQL 查看表上索引的 1 方法
  • 原文地址:https://www.cnblogs.com/zjz666/p/11201175.html
Copyright © 2011-2022 走看看