一款非常不错的PC手机端通用的jQuery响应式幻灯片轮播特效,仿小猪CMS官网首页焦点图幻灯片切换代码。
js代码
<script src="https://img.x22t.com/file/2020/04/25/4cf1bdb28e1d40b3eb5d47c48e7b1f462871.js"></script> <script src="https://img.x22t.com/file/2020/04/25/baa382261fd46b37e7b3bc3f8a5378a53975.js"></script> <script src="https://img.x22t.com/file/2020/04/25/7ceca2220c1db1070886c8c71a692fb44708.js"></script> <script> var mySwiper = new Swiper (".swiper-container", { pagination: ".pagination", paginationClickable :true, autoplay : 10000, speed:1, //autoplayDisableOnInteraction : false, onInit: function(swiper){ //Swiper2.x的初始化是onFirstInit swiperAnimateCache(swiper); //隐藏动画元素 swiperAnimate(swiper); //初始化完成开始动画 }, onSlideChangeEnd: function(swiper){ swiperAnimate(swiper); //每个slide切换结束时也运行当前slide动画 } }) $(".arrow-left").on("click", function(e){ e.preventDefault() mySwiper.swipePrev() }) $(".arrow-right").on("click", function(e){ e.preventDefault() mySwiper.swipeNext() }) </script>