swiper5 点击图换下一张_swiper实现图片轮播功能

2015-09-15 08:57:30

swiper是一个相当强大的图片展示插件，下面我来介绍一下swiper的简单图片轮播功能。一般情况下我们所说的图片轮播就是在一个区域内有几张图片循环展示，有的可以滑动图片观看下一张图，有的可以点击图下方的小点来选择哪个图，也有点击两侧的左右按钮来切换图片展示。我们先来看一下如何实现

Slide 1

Slide 2

Slide 3

Slide 4

Slide 5

Slide 6

Slide 7

Slide 8

Slide 9

Slide 10

上方这几个div暂且先替代图片，和图片的展示效果相同，下面再来看一下js该如何写

var swiper = new Swiper('.swiper-container', {