firefox - XUL 选项卡框选项卡滚动

Question

同样的问题已被问过in the Mozillazine forums earlier 。借用他的描述:

我正在开发 Firefox 扩展，但遇到了很大的问题。我的扩展程序中有很多选项卡，如果窗口尺寸较小，则某些选项卡不可见。这就是为什么我想放滚动条却无法成功。

这是我的代码

<tabbox flex="1">
<tabs>
<arrowscrollbox allowevents="true" flex="1" class="tabbrowser-arrowscrollbox" orient="horizontal">
<tab id="tab_1" label="Tab 1"/>
<tab id="tab_2" label="Tab 2"/>
...
<tab id="tab_9" label="Tab 9"/>
</arrowscrollbox>
</tabs>
<tabpanels flex="1">
<tabpanel flex="1" orient="vertical" >Tab 1 content</tabpanel>  
<tabpanel flex="1" orient="vertical" >Tab 2 content</tabpanel>  
...
<tabpanel flex="1" orient="vertical" >Tab 9 content</tabpanel>  
</tabpanels>
</tabbox>

在这种情况下，滚动在选项卡上确实起作用，但单击选项卡没有任何作用，因此不会显示相应的选项卡内容。 如果我从选项卡元素中删除 arrowscrollbox 元素，则不会出现滚动，并且某些选项卡不可见。

那么有人可以建议我一种既可以滚动又可以正常工作的选项卡的方法吗？

Answer 1

<tab>标签必须是 <tabs> 的直接子级标签，否则无法工作。 <tabs>标签不必是 <tabbox> 的直接子代但是，您可以放置​​ <arrowscrollbox> 标签之间的标记。这样就可以工作了:

<tabbox flex="1">
  <arrowscrollbox allowevents="true" class="tabbrowser-arrowscrollbox" orient="horizontal">
    <tabs>
      <tab id="tab_1" label="Tab 1"/>
      <tab id="tab_2" label="Tab 2"/>
      ...
      <tab id="tab_9" label="Tab 9"/>
    </tabs>
  </arrowscrollbox>
  <tabpanels flex="1">
    <tabpanel flex="1" orient="vertical" >Tab 1 content</tabpanel>
    <tabpanel flex="1" orient="vertical" >Tab 2 content</tabpanel>
    ...
    <tabpanel flex="1" orient="vertical" >Tab 9 content</tabpanel>
  </tabpanels>
</tabbox>