PageAdmin网站内容管理系统(CMS)交流论坛

注册

 

QQ登录

只需一步,快速开始

发新话题 回复该主题

banner不能轮播 [复制链接]

1#
请问banner不能轮播,如何设置?

这是程序的默认设置,该如何修改?谢谢!
QQ图片20190521233048.jpg (, 下载次数:0)

(2019/5/21 23:38:52 上传)

QQ图片20190521233048.jpg

分享 转发
TOP
2#

这个轮播插件用法参考:https://www.swiper.com.cn/ 这个网站教程
TOP
3#

banner轮播

折腾了一晚上,明白了。有相同问题的可参考,并备查:
<script>
        var mySwiper = new Swiper('#banner', {
            //direction: 'vertical', // 垂直切换选项 关
            //loop: true, // 循环模式选项. Swiper4无效
            effect: 'fade',//切换效果选择:'slide'(普通切换、默认),'fade'(淡入)'cube'(方块)'coverflow'(3d流)'flip'(3d翻转)
            //parallax: "true",//开启视差效果,默认:false
            speed: 4000,//切换速度,即两张图片交换的时间

            //是否循环
            autoplay: true,//启动自动切换,并使用默认的切换设置。默认:false
            autoplay: {
                delay: 5000, //自动切换的时间间隔,即图片停留多少时间开始切换
                disableOnInteraction: false, //点击之后轮播是否禁止:默认停止:true:继续:false
            },

            // 如果需要分页器
            pagination: {
                el: '.swiper-pagination',
                clickable: true,
                //clickableClass: 'my-pagination-clickable', //可点击,默认:swiper-pagination-clickable
            },

            // 如果需要前进后退按钮
            navigation: {
                nextEl: '.swiper-button-next',
                prevEl: '.swiper-button-prev',
            },

            // 如果需要滚动条
            scrollbar: {
                //el: '.swiper-scrollbar',//添加滑块
            },
        })
</script>
TOP
4#

上一楼的挺特别给力,自己琢磨出来的东西能分享出来真正好,马上去试下!
TOP
5#

按楼上方法搞定,能加个好友么QQ40792391
TOP
6#

回复 3楼xuerfu的帖子

感谢提供,已搞定,谢谢。
TOP
7#

学习了
TOP
8#

太感谢了
TOP
9#

回复 1楼xuerfu的帖子

不错,赞一个。
TOP
发新话题 回复该主题