zoukankan      html  css  js  c++  java
  • 关于图片延迟的一点思路

    第一张图片直接加载

    <div class="imgleft "> 
    <img src="http://images.cnblogs.com/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

    <img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

    <img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

    <img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

    <img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

    <img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

    <img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

    <img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

    <img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

    <img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

    <img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

    <img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

    <img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

    <img src="http://images.cnblogs.com/grey.gif" original="/images/newyl_21.jpg" class="lazyImg" width="1032" height="309"  alt="名信系列">

    <div>

    <script type="text/javascript">

    //限定加载范围 从第2张开始到第12张 结束 
    var index_n=1;
    x=0;
    $(document).ready(function(){
    $(window).scroll(function() {

    x++;
    if(x%3==0){
    // 滚动高度超过3次,加载图片
    $(".imgleft img:eq("+index_n+")").each(function(){
    $(this).attr("src",$(this).attr("original"));
    });
    index_n++
    }

    //限定加载范围 从第2张开始到第12张 结束 

    if(index_n==13){
    $(window).unbind("scroll");
    return;
    }
    });
    });

    </script> 

    //不知道鼠标滚动发送的次数是否一样  所以可能有的鼠标会不兼容  欢迎拍砖

  • 相关阅读:
    目标检测——Faster R_CNN使用smooth L1作为bbox的回归损失函数原因
    [LeetCode] 2. Add Two Numbers
    XAF 非持久化的详细视图界面全部清空
    4月份开发的问题汇总
    XAF GroupOperator合并查询筛选条件
    C#判断字符判断为空或者空格
    如何去掉C#字符串前后的空格
    IIS 发布出去未能加载文件或程序集“UHFReader”或它的某一个依赖项。试图加载格式不正确
    《图解HTTP》笔记
    Win10中的控制台程序会被鼠标单击暂停运行的解决办法
  • 原文地址:https://www.cnblogs.com/liucai/p/2696972.html
Copyright © 2011-2022 走看看