敏哥gege的gravatar头像
敏哥gege 2017-10-25 10:35:21

jquery+bootstrap多功能自定义选项卡插件

一款功能强大的jQuery选项卡代码,Bootstrap自定义选项卡插件支持关闭,添加,切换到定位,定位到当前,关闭其他,关闭所有,左滑动,右滑动,获取左右滑动步值,获取当前选项卡ID,获取所有选项卡宽度,获取所有选项卡功能代码等。

js代码
<script type="text/javascript" src="js/nth.tabs.min.js"></script>
<script>
    var nthTabs;
    $(function () {
        //一个低门槛的演示,更多需求看源码
        //基于bootstrap tab的自定义多标签的jquery实用插件,滚动条依赖jquery.scrollbar,图标依赖font-awesome
        nthTabs = $("#editor-tabs").nthTabs();
        nthTabs.addTab({
            id:'a',
            title:'孙悟空',
            content:'看我七十二变',
        }).addTab({
            /*换个姿势*/
            id:'b',
            title:'猪八戒-关不掉',
            content:'高老庄娶媳妇',
            active:true,
            allowClose:false,
        }).addTab({
            id:'c',
            title:'沙和尚',
            content:'请叫我大叔',
        }).addTab({
            id:'d',
            title:'唐僧',
            content:'光头一个',
        }).addTab({
            id:'e',
            title:'武松',
            content:'打虎猛汉',
        }).addTab({
            id:'f',
            title:'潘金莲',
            content:'大美女',
        }).addTab({
            id:'g',
            title:'来个标题长一点的的的来个标题长一点的的的',
            content:'你赢了',
        }).addTab({
            id:'h',
            title:'支持连贯操作',
            content:'没错就是这么爽',
        }).addTab({
            id:'i',
            title:'欢迎提意见',
            content:'一定一定',
        }).addTab({
            id:'j',
            title:'熬夜写的啊',
            content:'码农苦逼~',
        }).setActTab("#c");
    });
</script>

jquery+bootstrap多功能自定义选项卡插件jquery+bootstrap多功能自定义选项卡插件

gif动图


打赏

文件名:Bootstrap多功能自定义选项卡插件.zip,文件大小:395.41K 下载
  • /
      • /fonts
        • /fonts/fontawesome-webfont.eot
        • /fonts/fontawesome-webfont.ttf
        • /fonts/fontawesome-webfont.woff
        • /fonts/fontawesome-webfont.woff2
    • /index.html
      • /js
        • /js/bootstrap.min.js
        • /js/jquery.min.js
        • /js/jquery.scrollbar.min.js
最代码最近下载分享源代码列表最近下载
wcy071213  LV27 2020年7月1日
Michelle1106  LV5 2020年4月14日
zhaoxiaolei  LV5 2019年10月22日
Java基础入门  LV12 2019年7月3日
rovelove  LV1 2019年1月16日
Tomqing  LV2 2018年12月19日
hsz_2018  LV1 2018年7月18日
谭鬼鬼  LV48 2017年10月25日
最代码官方  LV167 2017年10月25日
最代码最近浏览分享源代码列表最近浏览
qweye123 2月19日
暂无贡献等级
yue12356  LV1 2023年12月31日
qwe88296649 2023年9月26日
暂无贡献等级
shuangfu  LV24 2023年9月5日
杏色五天  LV1 2022年12月11日
pokerf  LV4 2022年10月26日
fanjunzi  LV2 2022年5月25日
nickshen111  LV8 2021年9月16日
yellowfor  LV8 2021年6月30日
taijh999  LV13 2021年6月9日
顶部 客服 微信二维码 底部
>扫描二维码关注最代码为好友扫描二维码关注最代码为好友