Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dictum mattis velit, sit amet faucibus felis iaculis nec. Nulla laoreet justo vitae porttitor porttitor. Suspendisse in sem justo. Integer laoreet magna nec elit suscipit, ac laoreet nibh euismod. Aliquam hendrerit lorem at elit facilisis rutrum. Ut at ullamcorper velit. Nulla ligula nisi, imperdiet ut lacinia nec, tincidunt ut libero. Aenean feugiat non eros quis feugiat.
swiper11 demo 原链接：https://swiperjs.com/demos
以下案例兼容性：
Windows Chrome 正常
Windows Edge 正常
Mac Safari 正常
iPhone12 Safari 正常
iPhone12 微信浏览器 正常
华为P40 华为浏览器 正常
华为P40 百度浏览器 正常
华为P40 QQ浏览器 正常
华为P40 微信浏览器 正常
展示1个
DIVAS’ DREAM 项链1
¥17,100
DIVAS’ DREAM 项链2
¥27,100
DIVAS’ DREAM 项链3
¥37,100
DIVAS’ DREAM 项链4
¥47,100
DIVAS’ DREAM 项链5
¥57,100
DIVAS’ DREAM 项链6
¥67,100
展示3个+居中
DIVAS’ DREAM 项链1
¥17,100
DIVAS’ DREAM 项链2
¥27,100
DIVAS’ DREAM 项链3
¥37,100
DIVAS’ DREAM 项链4
¥47,100
DIVAS’ DREAM 项链5
¥57,100
DIVAS’ DREAM 项链6
¥67,100
展示3个+循环+点击事件+自动轮播+用户交互后重新开始轮播
DIVAS’ DREAM 项链1
¥17,100
DIVAS’ DREAM 项链2
¥27,100
DIVAS’ DREAM 项链3
¥37,100
DIVAS’ DREAM 项链4
¥47,100
DIVAS’ DREAM 项链5
¥57,100
DIVAS’ DREAM 项链6
¥67,100
自定义箭头上一个下一个+slideChange事件
DIVAS’ DREAM 项链1
¥17,100
DIVAS’ DREAM 项链2
¥27,100
DIVAS’ DREAM 项链3
¥37,100
DIVAS’ DREAM 项链4
¥47,100
DIVAS’ DREAM 项链5
¥57,100
DIVAS’ DREAM 项链6
¥67,100
添加 init="false" 属性来防止 Swiper 初始化，直到我们传递所有必需的参数。
DIVAS’ DREAM 项链1
¥17,100
DIVAS’ DREAM 项链2
¥27,100
DIVAS’ DREAM 项链3
¥37,100
DIVAS’ DREAM 项链4
¥47,100
DIVAS’ DREAM 项链5
¥57,100
DIVAS’ DREAM 项链6
¥67,100
分页、导航、滚动条
DIVAS’ DREAM 项链1
¥17,100
DIVAS’ DREAM 项链2
¥27,100
DIVAS’ DREAM 项链3
¥37,100
DIVAS’ DREAM 项链4
¥47,100
DIVAS’ DREAM 项链5
¥57,100
DIVAS’ DREAM 项链6
¥67,100
SlidesPerView auto
DIVAS’ DREAM 项链1
¥17,100
DIVAS’ DREAM 项链2
¥27,100
DIVAS’ DREAM 项链3
¥37,100
DIVAS’ DREAM 项链4
¥47,100
DIVAS’ DREAM 项链5
¥57,100
DIVAS’ DREAM 项链6
¥67,100
视差
Slide 1
Subtitle
Slide 2
Subtitle
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dictum mattis velit, sit amet faucibus felis iaculis nec. Nulla laoreet justo vitae porttitor porttitor. Suspendisse in sem justo. Integer laoreet magna nec elit suscipit, ac laoreet nibh euismod. Aliquam hendrerit lorem at elit facilisis rutrum. Ut at ullamcorper velit. Nulla ligula nisi, imperdiet ut lacinia nec, tincidunt ut libero. Aenean feugiat non eros quis feugiat.
Slide 3
Subtitle
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dictum mattis velit, sit amet faucibus felis iaculis nec. Nulla laoreet justo vitae porttitor porttitor. Suspendisse in sem justo. Integer laoreet magna nec elit suscipit, ac laoreet nibh euismod. Aliquam hendrerit lorem at elit facilisis rutrum. Ut at ullamcorper velit. Nulla ligula nisi, imperdiet ut lacinia nec, tincidunt ut libero. Aenean feugiat non eros quis feugiat.
Slide 4
Subtitle
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam dictum mattis velit, sit amet faucibus felis iaculis nec. Nulla laoreet justo vitae porttitor porttitor. Suspendisse in sem justo. Integer laoreet magna nec elit suscipit, ac laoreet nibh euismod. Aliquam hendrerit lorem at elit facilisis rutrum. Ut at ullamcorper velit. Nulla ligula nisi, imperdiet ut lacinia nec, tincidunt ut libero. Aenean feugiat non eros quis feugiat.