基本jquery的菜单标签页选项插件(原创)

所属分类:媒体-Tabs

 37174  404  查看评论 (16)
分享到微信朋友圈
X
基本jquery的菜单标签页选项插件(原创) ie兼容10

水平有限,欢迎提出建议

使用方法

菜单结构

<div class="menu">
   <a href="content.html#1">菜单管理</a>
</div>

标签页及内容html代码

<!--菜单HTML Start-->
        <div id="page-tab">
            <button class="tab-btn" id="page-prev"></button>
            <nav id="page-tab-content">
                <div id="menu-list">
                </div>
            </nav>
            <button class="tab-btn" id="page-next"></button>
            <div id="page-operation">
				<div id="menu-all">
					<ul id="menu-all-ul">
					</ul>
				</div>
            </div>
        </div>
		<!--菜单HTML End-->
		<!--iframe Start (根据页面顶部占用高度,自行调整高度数值)-->
        <div id="page-content" style="height: calc(100% - 155px);">
        </div>
		<!--iframe End-->

调用代码

//初始化a标签链接到tab
 $(".menu a").tab();
相关插件-Tabs

移动端tab切换

依赖jQuery tab切换,请在移动端预览查看最佳效果,支持移动端滑动切换
  Tabs
 35344  334

适合手机、pad等移动终端的tab响应式切换效果

适合手机、pad等移动终端的tab响应式切换效果
  Tabs
 59147  507

jQuery竖向轮播+点击切换

点击右边标题,切换左边图片
  Tabs
 33016  363

响应式tab选项卡布局

jQuery响应式tab选项卡布局
  Tabs
 37539  370

讨论这个项目(16)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    紫嫣凝雨 0
    2019/8/7 17:00:11
    在ie11里面使用有问题,tab项删除之后, 因为page-operation列里还存在的,所以tab项文字全部堆叠在一起 回复
    StellaHo 0
    2019/3/13 16:36:27
    tab项删除之后, 在page-operation列里还存在的
    回复
    遇见,未来 0
    2018/6/19 16:48:36
    我想要jQuery方法直接打开、刷新、关闭、标签的方法,不需要根据class属性打开,因为这样很有局限性 回复
    ??? 0
    2018/5/30 16:19:31
    有一些小bug,不是很值得花这些积分
        Amber19940
        2018/8/13 10:09:03
        什么问题呢?加在项目中影响使用么?
    回复
    (●―●) 0
    2018/5/29 17:17:12
    这个插件可以js动态添加吗?
    回复
    风间树 0
    2018/5/16 11:27:39
    水平移动有问题 ,改了好久没改好 回复
    yvan317 0
    2018/1/18 21:10:46

    IE6是否支持

        ☀ChLn0
        2018/3/12 10:49:44
        不支持
    回复
    林先生 0
    2017/11/10 15:05:42
    ?钷、?古 0
    2017/10/27 11:46:02

    就想要这样的 太赞了

        大太阳的大世界0
        2018/2/2 14:18:34

        好用么?我现在想下载这样的,感觉好贵,值不值?

    回复
    死亡刀刃 0
    2017/9/14 16:30:57

    能否在标签上 加上右键关闭 和刷新呢

        ☀ChLn0
        2018/3/12 10:50:15
        可以自己扩展
    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复