jQuery选项卡启用水平滚动

时间:2015-06-11 09:24:50

标签: jquery css jquery-ui jquery-ui-tabs jquery-tabs

如何在 单行 上的特定宽度内的jQuery标签上启用 水平滚动

默认情况下,jQuery UI插件会移动下一行的最后一个标签。

所以,我一直在使用一种解决方法,通过设置如下的css样式来增加宽度,

#tabs_div .scroller {
  overflow: auto;
}
#tabs_div ul { 
  width: 1100px; 
}

标签设置如下,

<div id='tabs_outer_div' class="tabs">
  <div id='tabs_div' class="scroller" style='display:none;width:100%'>
   <ul>....
 </div>
</div>

编辑包含jsfiddle,这里的标签显示在多行中。如何在一行(行)中设置它们。 - http://jsfiddle.net/karthikn_jay/pdnr0op9/

1 个答案:

答案 0 :(得分:2)

只需在样式表中将自定义样式添加到.ui-tabs .ui-tabs-nav.ui-tabs .ui-tabs-nav li,如果需要添加父级别selector

http://jsfiddle.net/pdnr0op9/3/ like this