一个页面使用多个相同Swiper轮播效果怎么写会不冲突
主要看你的轮播是怎么写的,一般用ID区分就行了
以常用的轮播插件Swiper为例
<!--下载插件http://www.swiper.com.cn/download/--> <!--引入插件--> <link rel="stylesheet" href="path/to/swiper.min.css"> <script src="path/to/swiper.min.js"></script> <!--HTML--> <div class="swiper-container" id="swiper1"><!--第一个轮播--> <div class="swiper-wrapper"> <div class="swiper-slide">图1</div> <div class="swiper-slide">图2</div> <div class="swiper-slide">图3</div> </div> </div> <div class="swiper-container" id="swiper2"><!--第二个轮播--> <div class="swiper-wrapper"> <div class="swiper-slide">图4</div> <div class="swiper-slide">图5</div> <div class="swiper-slide">图6</div> </div> </div> <!--JS--> <script> var mySwiper1 = new Swiper ('#swiper1'); //第一个轮播 var mySwiper2 = new Swiper ('#swiper2'); //第二个轮播 </script>