Swiper移动端网站的内容触摸滑动,轮播滑动
时间：2016-07-15 11:23:58
时间：2016-07-15 11:23:58
示例:
<link href="css/swiper-3.3.1.min.css" rel="stylesheet"/> <script src="js/swiper-3.3.1.min.js"></script> <style> .swiper-container { width: 100%; height: 150px; } .swiper-container img{ width: 100%; height: 150px; } </style> <div class="swiper-container"> <div class="swiper-wrapper"> <div class="swiper-slide"> <img style="height:150px" src="http://image.704xiaohua.cn:7777/advertisement/advPic131463488027912.jpg"/> </div> <div class="swiper-slide"> <img style="height:150px" src="http://image.704xiaohua.cn:7777/advertisement/advPic111463487969731.jpg"/> </div> <div class="swiper-slide"> <img style="height:150px" src="http://image.704xiaohua.cn:7777/advertisement/advPic121463488005414.jpg"/> </div> </div> <div class="swiper-pagination"></div> </div><script>
var mySwiper = new Swiper('.swiper-container',{
autoplay: 3000, //自动轮播参数
pagination: '.swiper-pagination', //分页器class
loop:true, //无限循环
grabCursor: true, //鼠标放上时变成手的形状
paginationClickable :true, //点击分页切换图像
// 如果需要前进后退按钮
nextButton: '.swiper-button-next',
prevButton: '.swiper-button-prev'
})
</script>
