首先让我们用积累了十四节……不十三节的功力来搭建一个基本的swiper的布局。并且根据需要来设置css样式。
<div class="swiper-container"> <div class="swiper-wrapper"> <div class="swiper-slide">h5edu 1<img src="logo.png"></div> <div class="swiper-slide">h5edu 2<img src="logo.png"></div> <div class="swiper-slide">h5edu 3<img src="logo.png"></div> <div class="swiper-slide">h5edu 4<img src="logo.png"></div> <div class="swiper-slide">h5edu 5<img src="logo.png"></div> <div class="swiper-slide">h5edu 6<img src="logo.png"></div> </div> <div class="swiper-pagination"></div> <div class="swiper-button-next"></div> <div class="swiper-button-prev"></div> </div>
然后到js当中进行页面的初始化，再加上我们的循环属性（loop：true）.
var swiper = new swiper('.swiper-container',{ pagination:'.swiper-pagination', paginationclickable:true, nextbutton:'.swiper-button-next', prevbutton:'.swiper-button-prev', slidesperview:1, spacebetween:30, loop:true //开启循环属性 });
完成之后我们就可以一直进行翻页了，能玩三天三夜，还不会累！
以上就是swiper的基础使用（十四）的内容。