0

スライド サイド メニューのサブメニューを作成する方法はありますか? JS フィドルのデモ

    <ul id="nav">
        <li><a href="#">Menu Item 1</a></li>
            <ul id="submenu">
                <li><a href="#">Submenu Item 1</a></li>
                <li><a href="#">Submenu Item 2</a></li>
            </ul>
        <li><a href="#">Menu Item 2</a></li>
    </ul>
4

1 に答える 1

3

Fiddle DEMO

変更されたマークアップ

asulの代わりに追加され、直接含むことはできませんliulul

<div id="menu">
    <ul>
        <li><a href="#">Menu Item 1</a>

            <ul id="submenu"> <!-- added ul instead of li -->
                <li><a href="#">Submenu Item 1</a>

                </li>
                <li><a href="#">Submenu Item 2</a>

                </li>
            </ul>
        </li>
        <li><a href="#">Menu Item 2</a>

        </li>
        <li><a href="#">Menu Item 3</a>

        </li>
    </ul>
</div>
<div id="right">
    <button type="button" id="button">Menu</button>
</div>

JS

$('#menu li:has("ul")').children('ul').hide(); //hide submenu
$('#button').toggle(
function () {
    $('#right').animate({
        left: 150
    });
},
function () {
    $('#right').animate({
        left: 0
    });
});
$('#menu li:has("ul")').click(function(){ 
    $(this).children('ul').slideToggle(); //toggle submenu
});

参考文献

.slideToggle()

：もっている（）

于 2013-10-30T16:00:13.103 に答える