Question

当标签太多时，ui标签是否有更好的方式/扩展可以处理/提供滚动标签的控件？

我发现了一些，但他们不使用最新的jquery-ui-1.10.3。例如.. Jizmoz Tabs在选项方面要好得多，但不适用于新的ui或jquery 1.9.1。

还有其他建议吗？

$("#tabs").tabs({
    scrollable: true,
    changeOnScroll: false,
    closable: true
});

Answer 1

使用this库。应引用jquery-migrate-1.2.1.js。用法示例：

    $("#tabs").xtabs({
        scrollable: true,
        changeOnScroll: false,
        closable: true
    });

这是更新的Jizmoz Tabs JSFIDDLE，它也是第一版的更改jquery scrollable tab。我在jquery-2.1.1中使用它并且一切运行良好。

Answer 2

这一行像魔术一样：

$(".ui-tabs-nav").hover(function () { $(this).css("height", "auto"); $(this).css("overflow", "hidden"); $(this).css("overflow", "auto"); }, function () { $(this).animate({ height: "32px" }, 600); });

它只在鼠标悬停在标题页眉上时显示完整标签，否则它只显示第一行标签（默认情况下为32px，但会根据您的需要进行更改）。

Answer 3

查看这些链接

第二个链接可能有帮助

http://riteshsblog.blogspot.in/2011/09/jquery-ui-tab-scroller-plugin.html

[http://jsfiddle.net/Bua2d]

Answer 4

replace "_super._create.apply(self);", with "self._superApply(self);"
replace "_super._update.apply(self);", with "self._superApply(self);"

虽然有效但有些错误。

Answer 5

我为此创建了一个插件，它使用Chrome样式制表符调整大小行为。

使用

初始化

$( ".tabpanel" ).tabs().tabs('overflowResize');

Demo

GitHub

jQuery UI选项卡：当选项卡太多时添加滚动控件

5 个答案: