之前碰到在项目中需要做一个视频播放+图片的自动切换轮播，需要视频播放完成以后再切换下一张图片。我是用swiper的，先按照自动轮播图片那样做，设置好swiper的一些属性，例如: 分页器(pagination: '.swiper-pagination')，分页器可否换图,需要换图(paginationClickable :true)，提高撤退退却按钮的设置，活动速度的快慢(speed)，可否要无穷轮回，是的话设置(loop:true)，需要自动播放的的话设置(autoplay: 1000)，操作了swiper-slide以后可否需要停止切换，默许是(autoplayDisableOnInteraction: true)，不需要的话(autoplayDisableOnInteraction: false)，
Swiper-slide高度需要随内容的多少窜改(autoHeight: true)等。
在最早做之前就需要先引入css和js，如图：
需要做的轮播结果以下图:
在html内里需要增加
以下图：
Css需要根据自己需要的结果自己写，然后js以下图：
另外寻常普通如果需要Swiper加上一些动画的话，
品牌网站优化，起首需要引入css，以下图：
然后在HTML内里找到需要活动的元素加上格式名为ani ，swiper-animate-effect(切换的结果)、swiper-animate-duration(连续的工夫)、swiper-animate-delay(耽误的工夫)也要设置好。以下图：
如许就能做出一些动画的结果了。