移动端echo.js 延迟加载图片控件

echo.js的github地址:https://github.com/toddmotto/echo

<img src="circle.png" alt="Photo" data-echo="timg.jpg">

<script type="text/javascript" src="echo.js"></script>

<script>

      echo.init({
         // options初始化参数
         
        });

</script>

options : 
     offset  默认值为0。设置上下左右到viewport的距离多少才加载图片。
     offsetVertical  默认值为0。设置上下到viewport的距离是多少才加载图片。
     offsetHorizontal  默认值为0。设置左右到viewport的距离是多少才加载图片。
     offsetTop  默认值为offsetVertical。设置顶部距离viewport的距离
     offsetButton  默认值为offsetVertical。设置顶部距离viewport的距离
     offsetLeft  默认值为offsetVertical。设置左边距离viewport的距离
     offsetRight  默认值为offsetVertical。设置右边距离viewport的距离
     throttle 单位毫秒 设置图片延迟加载时间,通俗点说就是函数调用的频度控制器,是连续执行时间间隔控制。主要应用的场景比如:鼠标移动,mousemove事件;DOM元素动态定位,window对象的resize和scroll事件。     
     debounce 单位布尔值,默认true,      unload 单位布尔值,默认false。该选项告诉echo,当图片滑动超过了viewport的时候不在加载该图片。
     callback 单位函数,回调函数会传递已更新的元素和操作(load或者unload)给回调函数。
 
同时,通过调用echo.reader()函数模式scroll函数,触发echo加载图片。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值