jquery tabs切换插件

这次用jq写的tabs其实很简单,代码只有两行,最主要的还是css上花了不少时间

eg:

<div class="tab-wrap">
    <div id="tab-title" class="com-tab-title">
        <h3><span class="tab-1 current">菜单1</span><span class="tab-2">菜单2</span><span class="tab-3">菜单3</span></h3>
    </div>
    <div id="tab-content" class="com-tab-cont">
        <div class="tab-1">这是内容1</div>
        <div class="tab-2 hide">这是内容2</div>
        <div class="tab-3 hide">这是内容3</div>
    </div>
</div>
本来在<span class="tab-1 current">菜单1</span>这边用的是ID的,后来因为动态给span加上class,某些属性不起作用,所以就改成了现在的这种方式。

造成某些属性不起的作用,经本人测试,得出以下结论:

ID,class的优先级关系

#id{border:1px red solid;}动态加上.class{border-top:none;}时一直没有效果,后来改成:

#id{} .class{border-top:1px red solid;}动态添加就有效果了!!

记录交流,如有错误,请指正!!

插件地址:http://www.ptycl.com/plugin/tabs.html

原文地址:https://www.cnblogs.com/jackychua/p/3006531.html