常用web插件收集（长期更新...）

一、echo.js 图片延迟加载

<img src="img/blank.gif" alt="Photo" data-echo="img/photo.jpg" />  <script type="text/javascript" src="https://cdn.bootcss.com/echo.js/1.7.3/echo.js"><script/><script type="text/javascript" >        echo.init({            offset: 100,            throttle: 250,            unload: false,            callback: function (element, op) {                console.log(element, 'has been', op + 'ed')            }        });    </script>

说明
参数 描述 默认值
offset 离可视区域多少像素的图片可以被加载 0
throttle 图片延迟多少毫秒加载 250
debounce 防抖动 true
unload 告诉echo是加载还是卸载视图中的图片，当图片离开视图区域时触发 false
callback 回调函数，用来检测图片是否加载 function()

最后echo.js还提供了一个.render()方法，用法如下：
echo.render();
应用场景：当你的页面没有发生滚动，而你想加载即将要显示的图片，如图片轮播，当第一张图片显示完，接着滑动展示第二张图片，这个时候使用
echo.render();
提前加载第二张图片，就不会出现图片加载卡顿白屏等现象。

二、fancybox 图片查看、页面弹框操作、提示等 一应俱全

<link href="https://cdn.bootcss.com/fancybox/3.1.25/jquery.fancybox.css" rel="stylesheet"><script src="https://cdn.bootcss.com/fancybox/3.1.25/jquery.fancybox.js"></script>

官方文档 ：http://fancyapps.com/fancybox/
效果：http://www.jq22.com/yanshi28