多语言展示
当前在线:1863今日阅读:103今日分享:49

swiper使用方法

今天有网友问我swiper使用方法。小编在网上查阅了资料,再根据个人经验所得,得出了以下结论,希望对你们有帮助!
工具/原料
1

电脑

2

软件

方法/步骤
1

1.首先加载插件,需要用到的文件有swiper.min.js和swiper.min.css文件。可下载Swiper文件或使用CDN。    ...        ...        ...

2

HTML内容

   
       
Slide 1
       
Slide 2
       
Slide 3
   
       
           
   
           
导航等组件可以放在container之外

3

你可能想要给Swiper定义一个大小,当然不要也行。.swiper-container {    width: 600px;    height: 300px;}

4

初始化Swiper:最好是挨着标签如果不能写在HTML内容的后面,则需要在页面加载完成后再初始化。或者这样(Jquery和Zepto)(推荐)

注意事项
1

有常识的操作

2

查阅相关资料

推荐信息