tab侧边
  • 示例:

    html:

    <div id="tabNews" class="bui-tab"> <div class="bui-tab-main"> <ul> <li> 滑动的内容 </li> <li> 滑动的内容 </li> </ul> </div> </div> <ul id="tabNav" class="bui-list" style="width:2rem"> <li class="bui-btn active"> TAB1 </li> <li class="bui-btn"> TAB2 </li> </ul>

    css:

    #tabNav { position: absolute; left: 0; top: 0; bottom: 0; background: #fff; z-index: 10; } #tabNews { margin-left: 2rem; }

    js:

    // viewport 来源于 ready的回调 var tabWidth = viewport.width() - $("#tabNav").width(); //按钮在tab外层,需要传id var tab = bui.slide({ id:"#tabNews", menu:"#tabNav", children:".bui-tab-main > ul", width: tabWidth, scroll: true, animate: false, delay: true })
  • 第2个tab