实现div循环切换（swiper插件）
注：swiper官网：https://2.swiper.com.cn/usage/index.html
- 首先加载插件，点击下载基础测试包，测试包里面已经包含了js和css文件。注意引用路径的修改
（下载地址：https://2.swiper.com.cn/download/index.html#file1）
<head>
<link rel="stylesheet" href="css/idangerous.swiper.css">
<script src="js/idangerous.swiper-2.x.min.js"></script>
</head>
- 书写HTML文件内容
<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide"> DIV页面1</div>
<div class="swiper-slide"> DIV页面2</div>
<div class="swiper-slide"> DIV页面3</div>
</div>
</div>
- 调用函数，根据需求进行相关参数修改，其他参数见官网
<script type="text/javascript">
window.onload = function() {
var mySwiper = new Swiper('.swiper-container',{
loop: true
//自动播放间隔
autoplay: 5000,
//用户点击后是否影响自动播放
autoplayDisableOnInteraction: false
});
}
</script>
|