0

我想用 jQuery 和 javascript 创建一个子菜单。我有这个html结构：

<nav class="container">
    <ul>
        <li><a href="#" title="Werken in de zorg">Werken in de zorg</a>
            <ul class="submenu">
                <li><a class="label" href="#" title="Lees meer over Werkvelden">Werkvelden</a></li>
                <li><a href="#" title="Lees meer over Eerstelijnzorg">Eerstelijnzorg</a></li>
                <li><a href="#" title="Lees meer over Geestelijke Gezondheidszorg">Geestelijke Gezondheidszorg</a></li>
                <li><a href="#" title="Lees meer over Gehandicaptenzorg">Gehandicaptenzorg</a></li>
            </ul>
        </li>
        <li><a href="#" title="Vacatures">Vacatures</a></li>
        <li><a href="#" title="Opleidingen en scholen">Opleidingen en scholen</a></li>
    </ul>
</nav>

在 CSS 中将 .submenu 设置为不显示。但现在是javascript。我想。如果你有一个 hovert li 项目。然后出现子菜单。当你离开子菜单时。然后仍然保持300ms。但是我应该如何处理 jQuery？

非常感谢您的帮助！

4

2 回答 2

1

你可以试试这个：

$(document).ready(function() {
    $('nav.container').children('ul').children('li').hover(function() {
        if ($(this).find('.submenu').length > 0) {
            $(this).find('.submenu').slideToggle();
        }
    }, function() {
        $(this).find('.submenu').delay(300).slideToggle();
    });
});

这是一个显示它工作的小提琴。

于 2011-12-21T13:16:39.607 回答
0

试试超级鱼 http://users.tpg.com.au/j_birch/plugins/superfish/#examples

它有延迟，您可以使用 hoverintent

于 2012-12-13T16:02:22.723 回答