1. 在网页顶部输入swiper.com.con,进入swiper官网
2. 点击” API文档”,获取轮播图代码的地方
3. 点击左侧“swiper初始化“,获取样式模板
复制对应代码,不用打叉部分:(注意,后面哪个 < / script> 还是要的,嘿嘿嘿)
4. 点击 ”获取swiper” 下的“swiper CDN地址“,意思就是使用网上存在的CDN地址,不用您下载对应的CSS文件
5. 找到对应的导入文件复制放到网页head部分:
本人不建议使用min版本,唯恐功能不全,不能满足您的欲望。
Link 和 script
把版本改成4.0.1或者4.0,2,两者要保持相同
因为使用的是CDN地址,确保在有网络的情况下执行。
6.调整轮播图样式可以在这里复制粘贴,全部都有:
什么花雕样式都有,怎么翻轮播图也有,怎么爽就怎么来
这里只是指明了部分小功能,其他可以点进去看展示
但是注意,不是盲目全部粘贴过来,只是粘贴对应的几行,例如:
选择轮播图-无缝轮播,loop(环路),
只需要复制圈出的“loop:true;”代码到对应位置即可
其中:分页器里就有轮播图小按钮圈圈点击选择页功能。
这样轮播图就能实现,如果看不到效果,可以给样式加背景颜色观察,另外样式都可以定义CSS添加。
如有没有弄明白的“28岁老程序员”们,欢迎评论留言,第一时间反馈给您,让您少掉两根头发。
1. 顶部输入swiper.com.con
2. 点击” API文档”
3. 点击左侧“swiper初始化“,获取样式模板
复制对应代码,不用打叉部分:
4. 点击 ”获取swiper” 下的“swiper CDN地址“
5. 找到对应的导入文件复制放到网页head部分:
Link 和 script
把版本改成4.0.1或者4.0,2,两者要保持相同
因为使用的是CDN地址,确保在有网络的情况下执行。
6.调整轮播图样式可以在这里复制粘贴,全部都有:
其中:分页器里就有轮播图小按钮圈圈点击选择页功能。
轮播图就能实现,如果看不到,可以给样式加背景颜色观察。