swiper全屏轮播图左右滑动切换特效

基于swiper制作的全屏轮播图左右滑动切换特效，自适应浏览器大小，支持手机移动端触屏滑动切换。

分类：图片代码 > 图片轮播难易：初级

查看演示下载资源下载积分： 30 积分

关注公众号，免费赠送安装视频教程、环境和学习视频，后面会不断更新。

js代码

<script type="text/javascript" src="js/swiper.min.js"></script>
        <script type="text/javascript">

            window.onload = function() {
                var swiper = new Swiper('.swiper-container',{
                    autoplay: 3000, //是否自动滚动
                    speed: 500,      //滚动速速
                    autoplayDisableOnInteraction: true,
                    loop: true,
                    centeredSlides: true,
                    slidesPerView: 3, //当前选中
                    pagination: '.swiper-pagination',
                    paginationClickable: true,
                    prevButton: '.swiper-button-prev', // 左右切换
                    nextButton: '.swiper-button-next', // 左右切换
                    onInit: function(swiper) {
                        swiper.slides[3].className = "swiper-slide swiper-slide-active"; //当前选中 状态
                    },
                    breakpoints: {
                        100: {
                            slidesPerView: 0,
                        }
                    }
                });
            }

        </script>