Jquery 延时加载图片

最新推荐文章于 2024-04-24 01:03:46 发布

红豆灬

最新推荐文章于 2024-04-24 01:03:46 发布

阅读量816

点赞数

分类专栏：常用插件及工具

本文链接：https://blog.csdn.net/doulinxu/article/details/59058177

版权

常用插件及工具专栏收录该内容

8 篇文章 0 订阅

订阅专栏

插件描述：Jquery 延时加载图片

页面延时加载图片，就是滑动滚动条的时候显示下面的内容，刚开始只加载可视区域

本来想用jquery.lazyload.js来解决问题，不过发现这个插件和页面已经采用的jquery.SuperSlide.2.1.1.js相冲突，暂时还没发现问题所在，所以搞了一个新的插件：下载地址：http://www.jq22.com/demo/delayLoading20160708/js/lyz.delayLoading.min.js

参数说明如下，亲测简单友好，共勉

参数说明

 
        $( 
        function  
        () { 
       
        $( 
        "img" 
        ).delayLoading({ 
       
        defaultImg:  
        "images/loading.jpg" 
        ,   
        // 预加载前显示的图片 
       
        errorImg:  
        "" 
        ,                       
        // 读取图片错误时替换图片(默认：与defaultImg一样) 
       
        imgSrcAttr:  
        "originalSrc" 
        ,          
        // 记录图片路径的属性(默认：originalSrc，页面img的src属性也要替换为originalSrc) 
       
        beforehand: 0,                      
        // 预先提前多少像素加载图片(默认：0) 
       
        event:  
        "scroll" 
        ,                    
        // 触发加载图片事件(默认：scroll) 
       
        duration:  
        "normal" 
        ,                 
        // 三种预定淡出(入)速度之一的字符串("slow", "normal", or "fast")或表示动画时长的毫秒数值(如：1000),默认:"normal" 
       
        container: window,                  
        // 对象加载的位置容器(默认：window) 
       
        success:  
        function  
        (imgObj) { },     
        // 加载图片成功后的回调函数(默认：不执行任何操作) 
       
        error:  
        function  
        (imgObj) { }        
        // 加载图片失败后的回调函数(默认：不执行任何操作) 
       
        }); 
       
        });