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