Swiper 的结构和基础原理
Swiper 的每个展示块（屏）为一个slide，slide中放置图片或文字等展示的内容，全部slide排成一行(或多行)包含在包装器wrapper中，而总容器container 又包裹着wrapper和箭头按钮控件navigation以及分页器控件pagination。
当手指（或鼠标）触摸滑动Swiper时，Swiper在浏览器每一帧通过计算滑动的距离差对wrapper进行位移（transform）从而产生拖动的效果。在手指（或鼠标）释放时，计算下一个slide的起始位置对wrapper设置位移动画（transition），从而产生切换动画效果。
Swiper7的API变化
Swiper容器的默认类名变更为'.swiper'，之前是'.swiper-container'。新增两个3D过渡效果，自由模式和网格组件化。
Swiper5的API变化
Swiper5 增加了CSS模式（cssMode），并且可以通过CSS文件修改Swiper颜色风格。
Swiper4的API变化
Swiper4 将组件的相关选项整合起来了，并且修改了回调函数获取swiper 实例的方式为this关键词。
组件列表
| 模块 | 功能 | 版本 |
|---|---|---|
| Navigation | 按钮 | |
| Pagination | 分页器 | |
| Scrollbar | 滚动条 | |
| Autoplay | 自动切换 | |
| FreeMode | 自由模式 | 7.0.0 |
| Grid | 网格分布 | 7.0.0 |
| Manipulation | 动态操纵 | 7.0.0 |
| Parallax | 视差效果 | |
| Lazy | 延迟加载图片 | |
| EffectFade | 渐变过渡 | |
| EffectCoverflow | 行进翻转过渡 | |
| EffectFlip | 翻转过渡 | |
| EffectCube | 方块过渡 | |
| EffectCards | 卡片过渡 | 7.0.0 |
| EffectCreative | 创意性过渡 | 7.0.0 |
| Thumbs | 缩略图 | 4.4.1 |
| Zoom | 缩放 | |
| Keyboard | 键盘 | |
| Mousewheel | 鼠标 | |
| Virtual | 虚拟块 | |
| HashNavigation | 锚导航 | |
| History | 历史导航 | |
| Controller | 双向控制 | |
| A11y | 障碍使用辅助 |