Question

我有以下脚本：

http://jsfiddle.net/oshirowanen/6SUwR/3/

如何根据下拉列表中的字符为下拉部分指定动态宽度？例如，如果“导航1”是“这是导航中的第一项”，如何使整个下拉列表的宽度自动变宽，但不会影响导航按钮的大小，导致下拉列表时鼠标悬停“编？

基本上，我不想在下拉列表中包含文字，但与此同时，我不想按下该下拉列表来更广泛。

Answer 1

这就是你要追求的吗？

http://jsfiddle.net/lukemartin/W9TzP/

基本上只需将.container的宽度设置为auto，然后从.container中取出背景色并将其放在每个.nav_item上。还添加了一些浮动和清除，因此设置了正确的宽度。

希望有所帮助：）

Answer 2

你可以使用这个jQuery代码

 var maxWidth = 0;
    $(".container a .nav_item").each(function() {
        if (($(this).width())> maxWidth) {
            maxWidth = $(this).width();
        }
    });
    $(".container").width(maxWidth+10);

以上将找到最大宽度，并将其应用于.container（+10用于您的填充）。

演示：http://jsfiddle.net/6SUwR/23/

基于文本的更广泛的下拉列表

2 个答案: