video标签做懒加载处理

使用到的插件：

　　　　　　jquery.js(任意版本，看需求)

　　　　　　lazyLoad.js(懒加载插件)

代码示例：

　　1、data-src属性是路径（这里和图片懒加载用法相同）class=“lazyLoad”是为了方便选择

 

 2、这里有两种写法，如果报错： jQuery(…).lazyload is not a function
将 $(document).ready的写法换成 jQuery(document).ready

 

 

接下来划重点，考试要考！

lazyload默认只适配image标签
不支持video的懒加载
所以需要修改lazyload源码

不要慌~

3、打开lazyload.js文件，其实代码并不多，只需要改两个地方

 

 

 

 这里的意思是判断对象是img标签的才会执行代码块，同理，当我们使用video标签时，可将判断条件"img"改成"video"(这种比较片面)，也可以在增加一个else if(){}判断(推荐，可用同时做img和video的懒加载，主要得看需求来)

4、下面是更改后的（步骤三圈出来的两个位置都需要更改，下面只改了一个地方）

 

 

 

  

OK~ 收工

点个赞吧~