查看: 1511|回复: 2
打印 上一主题 下一主题

新手,问一个需求的解决方法

[复制链接]
  • TA的每日心情

    2019-7-9 17:27
  • 签到天数: 2 天

    [LV.1]初来乍到

    1

    主题

    4

    帖子

    23

    积分

    新手上路

    Rank: 1

    积分
    23
    跳转到指定楼层
    楼主
    发表于 2019-7-9 17:25:29 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式
            <a class="changeBtn">切换slide</a>
            <div class="swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide">
                        <img class="swiperTheCardImg" src="http://via.placeholder.com/219x210">
                    </div>
                    <div class="swiper-slide">
                        <img class="swiperTheCardImg" src="http://via.placeholder.com/219x220">
                    </div>
                    <div class="swiper-slide">
                        <img class="swiperTheCardImg" src="http://via.placeholder.com/219x230">
                    </div>
                </div>
            </div>


    var mySwiper = new Swiper ('.swiper-container', {
            effect:'fade',
            spaceBetween:11,
            simulateTouch:false,
            onlyExternal:true,
            slidesPerView:3,
            loop:true,
            slidesPerGroup:3,
            nextButton:'.changeBtn',
            observer: true,
            observeParents: true
    })


    代码如上   
    需求   
    1.同时展示3个slide.
    2.  切换按钮->切换效果为 fade
    3.slide数据长度不定->循环展示


    问题是  在同时展示3个slide的情况下,把切换效果改成fade 样式就会乱
    分享到:  QQ好友和群QQ好友和群 QQ空间QQ空间 腾讯微博腾讯微博 腾讯朋友腾讯朋友
    收藏收藏 分享分享 分享淘帖
    回复

    使用道具 举报

  • TA的每日心情

    2019-7-9 17:27
  • 签到天数: 2 天

    [LV.1]初来乍到

    1

    主题

    4

    帖子

    23

    积分

    新手上路

    Rank: 1

    积分
    23
    沙发
     楼主| 发表于 2019-7-10 08:55:30 | 只看该作者
    额.那咋办呢?
    回复 支持 反对

    使用道具 举报

    该用户从未签到

    0

    主题

    3

    帖子

    7

    积分

    新手上路

    Rank: 1

    积分
    7
    板凳
    发表于 2019-7-15 14:04:47 | 只看该作者
    slidesPerView的值给为 'auto',然后设置每一个slide的宽度就可以了
    回复 支持 反对

    使用道具 举报

    您需要登录后才可以回帖 登录 | 立即注册

    本版积分规则

    Archiver|手机版|小黑屋|Swiper中文网 ( 粤ICP备15001020号

    GMT+8, 2024-4-20 09:02 , Processed in 0.067656 second(s), 26 queries .

    Powered by Discuz! X3.2

    © 2001-2013 Comsenz Inc.

    快速回复 返回顶部 返回列表