查看: 64303|回复: 38
打印 上一主题 下一主题

急!!swiper做选项卡切换,内容高度不一样,如何自适应。

[复制链接]

该用户从未签到

1

主题

1

帖子

5

积分

新手上路

Rank: 1

积分
5
跳转到指定楼层
楼主
发表于 2015-6-6 11:47:54 | 只看该作者 回帖奖励 |倒序浏览 |阅读模式
//选项卡
var tabSwiper = new Swiper('.tabSwiper', {
    pagination: '.tab-pagination',
    paginationClickable: true,
    //calculateHeight: true,
    paginationBulletRender: function (index, className) {
    switch (index) {
      case 0: name='选项卡1';break;
      case 1: name='选项卡2';break;
      case 2: name='选项卡3';break;
      default: name='';
    }
      return '<span class="' + className + '">' + name + '</span>';
    },
});
用swiper做了个移动端的选项卡,但是每个选项里的内容高度不一样,而swiper-wrapper是显示的最大高度,所以有些swiper-slide容器会有很大的空白,求大神指教。


分享到:  QQ好友和群QQ好友和群 QQ空间QQ空间 腾讯微博腾讯微博 腾讯朋友腾讯朋友
收藏收藏 分享分享 分享淘帖
回复

使用道具 举报

该用户从未签到

0

主题

1

帖子

11

积分

新手上路

Rank: 1

积分
11
推荐
发表于 2016-1-6 13:06:41 | 只看该作者
这个简单啊,swiper-slide{height:10px}    swiper-slide-active { height:auto}

点评

评分: 5.0
评分: 5
加一个autoHeight: true, 就可以了!最简单的  发表于 2018-5-28 14:08
试了,可以用,不错  发表于 2017-12-4 11:27
怎么解决的?说说,如果swiper-slide容器的内容是ajax获取的呢  发表于 2017-3-6 22:57
采用 了你的方法,不错,解决了  发表于 2016-11-7 14:33
回复 支持 9 反对 0

使用道具 举报

该用户从未签到

1

主题

5

帖子

38

积分

新手上路

Rank: 1

积分
38
推荐
发表于 2015-7-9 14:45:10 | 只看该作者
这个问题我之前也遇到,一直不知道怎么解决,力顶楼主!!!

点评

我也是遇到这个问题  发表于 2015-7-15 11:43
回复 支持 1 反对 1

使用道具 举报

该用户从未签到

0

主题

1

帖子

4

积分

新手上路

Rank: 1

积分
4
推荐
发表于 2015-7-7 16:12:58 | 只看该作者
很简单啊,用API   onSlideChageStart  

点评

能详细说说嘛,在onSlideChangeStart中写什么呢  发表于 2016-11-7 14:35
回复 支持 1 反对 0

使用道具 举报

  • TA的每日心情

    2017-12-27 10:36
  • 签到天数: 2 天

    [LV.1]初来乍到

    1万

    主题

    1万

    帖子

    7万

    积分

    管理员

    Rank: 9Rank: 9Rank: 9

    积分
    76217
    沙发
    发表于 2015-6-7 22:56:26 | 只看该作者
    回复 支持 反对

    使用道具 举报

    该用户从未签到

    0

    主题

    1

    帖子

    4

    积分

    新手上路

    Rank: 1

    积分
    4
    板凳
    发表于 2015-6-9 17:49:29 | 只看该作者
    只能使用一个块的嵌套你的内容,做超出滚动设置
    回复 支持 反对

    使用道具 举报

    该用户从未签到

    1

    主题

    5

    帖子

    38

    积分

    新手上路

    Rank: 1

    积分
    38
    6#
    发表于 2015-7-9 14:52:07 | 只看该作者
    xx1314o 发表于 2015-7-7 16:12
    很简单啊,用API   onSlideChageStart

    这个好像可以!
    回复 支持 反对

    使用道具 举报

    该用户从未签到

    1

    主题

    6

    帖子

    18

    积分

    新手上路

    Rank: 1

    积分
    18
    7#
    发表于 2015-7-15 11:44:20 | 只看该作者
    这个怎么设置,我设置了不可以
    回复 支持 反对

    使用道具 举报

  • TA的每日心情
    慵懒
    2019-8-26 15:39
  • 签到天数: 1 天

    [LV.1]初来乍到

    0

    主题

    12

    帖子

    96

    积分

    注册会员

    Rank: 2

    积分
    96
    8#
    发表于 2015-9-24 17:52:51 | 只看该作者
    回复 支持 反对

    使用道具 举报

    该用户从未签到

    1

    主题

    5

    帖子

    47

    积分

    新手上路

    Rank: 1

    积分
    47
    9#
    发表于 2015-10-8 01:51:56 | 只看该作者
    我也是遇到这个问题,要怎么让第二个从开始位置显示
    回复 支持 反对

    使用道具 举报

    该用户从未签到

    1

    主题

    5

    帖子

    47

    积分

    新手上路

    Rank: 1

    积分
    47
    10#
    发表于 2015-10-8 01:54:39 | 只看该作者
    chen1110103 发表于 2015-6-7 22:56
    像这种吗
    http://swiper2.swiper.com.cn/demo/demo-apps/simple/index.html

    请问这种是怎么实现的?小弟码农一个,请赐教
    回复 支持 反对

    使用道具 举报

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

    本版积分规则

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

    GMT+8, 2024-4-20 19:53 , Processed in 0.071790 second(s), 28 queries .

    Powered by Discuz! X3.2

    © 2001-2013 Comsenz Inc.

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