swiper-slide-5.4.1文件中demos部分展示效果（Self use）

swiper-slide-5.4.1文件中demos部分展示效果（Self use）

160-scroll-container.html

180-nested.html

层层嵌套

190-grab-cursor.html

220-effect-fade.html

260-keyboard-control.html

270-mousewheel-control.html

280-autoplay.html

会自动播放

290-dynamic-slides.html

可以点击添加左右窗口

300-thumbs-gallery.html

下方的小图片相当于图片预览，可以通过下方的图片选择上方的图片，下方的图片会随着上方主图的选择而变为主图左右的图片

310-thumbs-gallery-loop.html

与300相似，这个图片是左右循环一直往复的

320-multiple-swipers.html

横向窗格滑动，鼠标左右滑动

330-hash-navigation.html

简单的左右滑动，节奏稍快

在每个slide处增加data-hash属性，这样当你的swiper切换时你的页面url就会加上这个属性的值了，你也可以通过进入页面时修改页面url让swiper在初始化时切换到指定的slide。

340-history.html

图片效果与330相似

在slide切换时可无刷新更换URL和浏览器的history.state(pushState)。这样每个slide都会拥有一个自己的URL。

使用history还必需在slide上增加一个属性data-history，例

350-rtl.html

计数自右向左

360-parallax.html

左右滑动，网址不会发生改变

370-lazy-load-images.html

380-responsive-breakpoints.html

381-ratio-breakpoints.html

390-autoheight.html

400-zoom.html

410-virtual-slides.html

420-custom-plugin.html

430-slideable-menu.html

440-change-direction.html

450-watchSlidesVisibility.html

参见：
https://www.swiper.com.cn/