202 移动端常用开发插件：fastclick ，Swiper ，lsuperslide，iscroll，zy.media.js

2021-11-21 15:20:25

1.5.1 什么是插件

移动端要求的是快速开发，所以我们经常会借助于一些插件来帮我完成操作，那么什么是插件呢？

JS 插件：是 js 文件，它遵循一定规范编写，方便程序展示效果，拥有特定功能且方便调用。如轮播图和瀑布流插件。

特点：它一般是为了解决某个问题而专门存在，其功能单一，并且比较小。

我们以前写的animate.js 也算一个最简单的插件

fastclick 插件解决 300ms 延迟。

GitHub官网地址： https://github.com/ftlabs/fastclick

1.5.2 插件的使用

引入 js 插件文件。
按照规定语法使用。
fastclick 插件解决 300ms 延迟。

GitHub官网地址： https://github.com/ftlabs/fastclick

if ('addEventListener' in document) {
            document.addEventListener('DOMContentLoaded', function() {
                       FastClick.attach(document.body);
            }, false);
}

1.5.3 Swiper 插件的使用

中文官网地址： https://www.swiper.com.cn/

引入插件相关文件。
按照规定语法使用

1.5.4 其他移动端常见插件：lsuperslide、iscroll

lsuperslide： http://www.superslide2.com/

l iscroll： https://github.com/cubiq/iscroll

1.5.5 插件的使用总结

1.确认插件实现的功能

2.去官网查看使用说明

3.下载插件

4.打开demo实例文件，查看需要引入的相关文件，并且引入

5.复制demo实例文件中的结构html，样式css以及js代码

1.5.6 移动端视频插件 zy.media.js

H5 给我们提供了 video 标签，但是浏览器的支持情况不同。

不同的视频格式文件，我们可以通过source解决。

但是外观样式，还有暂停，播放，全屏等功能我们只能自己写代码解决。

这个时候我们可以使用插件方式来制作。

我们可以通过 JS 修改元素的大小、颜色、位置等样式。