<html>
<head>
<link rel="stylesheet" href="https://cdn.bootcss.com/Swiper/3.4.2/css/swiper.min.css">
<script src="https://cdn.bootcss.com/Swiper/3.4.2/js/swiper.min.js"></script>
<!-- 覆盖默认切换效果 为匀速 -->
<style>
/*插件外层容器 用来定义宽高等其他样式*/
.swiper-container{
width: 600px;
height: 300px;
}
/*插件的wrapper 这是关键， 覆盖插件默认切换效果为匀速*/
.swiper-wrapper{
transition-timing-function: linear;
}
</style>
</head>
<body>
<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide">Slide 1</div>
<div class="swiper-slide">Slide 2</div>
<div class="swiper-slide">Slide 3</div>
<div class="swiper-slide">Slide 4</div>
<div class="swiper-slide">Slide 5</div>
<div class="swiper-slide">Slide 6</div>
<div class="swiper-slide">Slide 7</div>
</div>
</div>
<script>
var mySwiper = new Swiper ('.swiper-container', {
autoplay:1,//自动滚动
loop:true,//循环
speed:5000,//滚动速度
slidesPerView : 4,//slide可见数量
spaceBetween : 10//slide之间的距离（单位px）
})
</script>
</body>
</html>
