移动可滑动切换tab选项卡

所属分类:媒体-Tabs

 16304  130  查看评论 (62)
移动可滑动切换tab选项卡 ie兼容9
var swiper1 = new Swiper('.swiper1', {
    slidesPerView: 5.5, //头部一行显示多少个 .5表示显示半个
    paginationClickable: true, //此参数设置为true时,点击分页器的指示点分页器会控制Swiper切换。
    spaceBetween: 10, //slide之间的距离(单位px)。
    freeMode: true, //默认为false,普通模式:slide滑动时只滑动一格,并自动贴合wrapper,设置为true则变为free模式,slide会根据惯性滑动且不会贴合。
    loop: false, //是否可循环
    onTab: function(swiper) {
        var n = swiper1.clickedIndex;
    }
});

引用js swiper的js css

样式就在页面上  已经写好的  直接用  

下面有联动页面的切换 可以手动翻页,也可以自己写  

相关插件-Tabs

响应式tab选项卡布局

jQuery响应式tab选项卡布局
  Tabs
 11588  69

jQuery产品切换tab选项卡

特别好用的tab选项卡,可以轮播多张图片,无多余代码注释全
  Tabs
 9344  44

js仿660网站宽屏图片选项卡切换代码

js仿660网站宽屏图片选项卡切换代码
  Tabs
 7580  35

jquery水平滑动tab选项卡

jquery水平滑动tab选项卡
  Tabs
 26217  193

讨论这个项目(62)回答他人问题或分享插件使用方法奖励jQ币

    SageXiang 0
    2018/5/23 7:16:43
    非常好,不过我已经把代码修改得更加简洁直观 回复
    君千雪 0
    2018/2/6 18:05:25

    能我发一份吗楼主1205798203@qq.com

    回复
    coquettish_chubby 0
    2018/1/11 16:54:59

    为啥我分享了没有给币呢

    回复
    coquettish_chubby 0
    2018/1/11 16:51:35

    用着还行

        玩玩玩哇0
        2018/1/17 9:48:31

        大佬 可以发一下这个么

    回复
    mochen91 0
    2018/1/9 21:16:14

    现在还能麻烦发一份吗?正是想要的,用的是swiper JS库。

    mochen91#gmail.com   (#换成@)

    回复
    mochen91 0
    2018/1/9 21:12:25
    还真正好是想要的,和swiper搭的。 回复
    D ??RING 0
    2018/1/9 17:30:15

    怎么动态添加导航栏 添加了就不能用  为啥

    回复
    Lyl路缘 0
    2018/1/5 11:26:56
    selected  当前红色的横线  怎么设置成有滑动效果的 回复
    ┽?初、夏ミ 0
    2017/12/27 17:09:51

    我用的时候为什么下面内容的高才是68px?

        ┽?初、夏ミ0
        2017/12/27 17:12:02

        原来你写头部的css样式不能外链

    回复
    !。???? 0
    2017/12/24 22:08:12

    多谢

        SSM010
        2018/3/30 1:33:15
        谁有代码?发一下,谢谢
    回复
取消回复