需要更改下拉菜单的宽度,具体取决于嵌套ul的数量

卡鲁克

需要更改下拉菜单的宽度,具体取决于嵌套ul的数量。

if( $('.mg-main-menu li .submenu li ul').size() == 1 )
{
    $('.mg-main-menu li .submenu').css({"width" : "250px"}); 
};


if( $('.mg-main-menu li .submenu li ul').size() == 2 )
{
    $('.mg-main-menu li .submenu').css({"width" : "500px"}); 
};


if( $('.mg-main-menu li .submenu li ul').size() == 3 )
{
    $('.mg-main-menu li .submenu').css({"width" : "750px"}); 
};


if( $('.mg-main-menu li .submenu li ul').size() == 4 )
{
    $('.mg-main-menu li .submenu').css({"width" : 1000px"}); 
};

结构

<ul class="mg-main-menu">
    <li><a href="#"></a>
        <ul class="submenu">
            <li><a href="#"></a>
                <ul>
                    <li><a href="#"></a></li>
                </ul>
            </li>
        </ul>
    </li>   

    <li><a href="#"></a>    
        <ul class="submenu">
            <li><a href="#"></a>
                <ul>
                    <li><a href="#"></a></li>
                </ul>
                <ul>
                    <li><a href="#"></a></li>
                </ul>
            </li>
        </ul>
    </li>   

    <li><a href="#"></a>
        <ul class="submenu">
            <li><a href="#"></a>
                <ul>
                    <li><a href="#"></a></li>
                </ul>
                <ul>
                    <li><a href="#"></a></li>
                </ul>
                <ul>
                    <li><a href="#"></a></li>
                </ul>
            </li>
        </ul>
    </li>

    <li><a href="#"></a>
        <ul class="submenu">
            <li><a href="#"></a>
                <ul>
                    <li><a href="#"></a></li>
                </ul>
                <ul>
                    <li><a href="#"></a></li>
                </ul>
                <ul>
                    <li><a href="#"></a></li>
                </ul>
                <ul>
                    <li><a href="#"></a></li>
                </ul>
            </li>
        </ul>
    </li>
</ul>

代码不起作用:)

如何使用属性$(this)Width编写工作代码应准确地应用于所需的类别,而不是全部。

我不知道该怎么办,请帮忙。

hon2a

我认为您正在寻找这样的东西:

$('.mg-main-menu li .submenu').each(function () {
    $(this).css({
        width: (250 * Math.min($('li ul', this).length, 4)) + 'px'
    });
});

Math.max()如果您不想限制宽度删除呼叫)。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

更改下拉菜单的背景颜色

来自分类Dev

颜色更改下拉菜单javascript

来自分类Dev

在下拉菜单中设置默认值,具体取决于其他值

来自分类Dev

HTML。隐藏/显示下拉菜单,具体取决于是否在另一个下拉菜单中选择了一个选项

来自分类Dev

自动复制并粘贴到不同的选项卡,具体取决于从下拉菜单中选择的选项

来自分类Dev

更改下拉菜单选项后,所有下拉菜单都在更改

来自分类Dev

显示/隐藏取决于下拉菜单选择

来自分类Dev

在滚动更改下拉菜单上的放置位置

来自分类Dev

更改下拉菜单中的表单动作

来自分类Dev

如何在Django中动态更改下拉菜单

来自分类Dev

根据类别更改下拉菜单以匹配单击的链接

来自分类Dev

我无法更改下拉菜单的字体大小

来自分类Dev

更改下拉菜单中的表单操作

来自分类Dev

更改下拉菜单中的部分文字

来自分类Dev

选择更改下拉菜单的特定形式

来自分类Dev

使用javascript更改下拉菜单的重绘功能

来自分类Dev

更改下拉菜单项的颜色

来自分类Dev

下拉菜单取决于其他下拉菜单-angularjs

来自分类Dev

根据另一个下拉菜单更改下拉菜单

来自分类Dev

在其他下拉菜单中选择更改下拉菜单值

来自分类Dev

Bootstrap3 Mega菜单更改下拉宽度

来自分类Dev

需要调整引导程序下拉菜单的宽度

来自分类Dev

我有两个下拉菜单,如果更改下拉菜单的值,它将影响另一个下拉菜单

来自分类Dev

文本框输出取决于下拉菜单中的选择

来自分类Dev

VueJS多个下拉菜单-渲染选项取决于第一个选择的值

来自分类Dev

文本框输出取决于下拉菜单中的选择

来自分类Dev

过滤角度下拉菜单功能取决于您先前选择的内容

来自分类Dev

更改下拉菜单列表项为正方形

来自分类Dev

更改下拉菜单列表项为正方形

Related 相关文章

  1. 1

    更改下拉菜单的背景颜色

  2. 2

    颜色更改下拉菜单javascript

  3. 3

    在下拉菜单中设置默认值,具体取决于其他值

  4. 4

    HTML。隐藏/显示下拉菜单,具体取决于是否在另一个下拉菜单中选择了一个选项

  5. 5

    自动复制并粘贴到不同的选项卡,具体取决于从下拉菜单中选择的选项

  6. 6

    更改下拉菜单选项后,所有下拉菜单都在更改

  7. 7

    显示/隐藏取决于下拉菜单选择

  8. 8

    在滚动更改下拉菜单上的放置位置

  9. 9

    更改下拉菜单中的表单动作

  10. 10

    如何在Django中动态更改下拉菜单

  11. 11

    根据类别更改下拉菜单以匹配单击的链接

  12. 12

    我无法更改下拉菜单的字体大小

  13. 13

    更改下拉菜单中的表单操作

  14. 14

    更改下拉菜单中的部分文字

  15. 15

    选择更改下拉菜单的特定形式

  16. 16

    使用javascript更改下拉菜单的重绘功能

  17. 17

    更改下拉菜单项的颜色

  18. 18

    下拉菜单取决于其他下拉菜单-angularjs

  19. 19

    根据另一个下拉菜单更改下拉菜单

  20. 20

    在其他下拉菜单中选择更改下拉菜单值

  21. 21

    Bootstrap3 Mega菜单更改下拉宽度

  22. 22

    需要调整引导程序下拉菜单的宽度

  23. 23

    我有两个下拉菜单,如果更改下拉菜单的值,它将影响另一个下拉菜单

  24. 24

    文本框输出取决于下拉菜单中的选择

  25. 25

    VueJS多个下拉菜单-渲染选项取决于第一个选择的值

  26. 26

    文本框输出取决于下拉菜单中的选择

  27. 27

    过滤角度下拉菜单功能取决于您先前选择的内容

  28. 28

    更改下拉菜单列表项为正方形

  29. 29

    更改下拉菜单列表项为正方形

热门标签

归档