Jquery 下拉菜单（带有图像和UL LI列表）

我有一个下拉菜单（我固定了位置）和

显示：无然后我只是将显示更改为块。我有这个：

JavaScript

$('.dropdownmenu').hover(function () {
        console.log("hovered");
    },
    function () {
        console.log("out");
    }
);

HTML

<div class="dropdownmenu" style="display: none;">
    <div id="dropdownmenuheader">
        <ul class="dropdownmenulist">
            <li>
                <div class="dbordermenulist"><a href="/blah">Web design & development</a>
                </div>
            </li>
            <li>
                <div class="dbordermenulist"><a href="/blah">Web hosting</a>
                </div>
            </li>
            <li>
                <div class="dbordermenulist"><a href="/blah">Branding</a>
                </div>
            </li>
            <li>
                <div class="dbordermenulist"><a href="/blah">Digital Marketing</a>
                </div>
            </li>
            <li style="border-bottom: 0;">
                <div class="dbordermenulist" style="border-bottom: 0;"><a href="/blah">Software Development</a>
                </div>
            </li>
        </ul>
    </div>
    <div id="dropdowngradient"></div>
</div>















但mouseenter、mouseleave或hover似乎不起作用，我试图创造一种效果，当有人在它上面悬停时，它保持可见，但当鼠标离开2秒时，它就会消失。（我知道我需要使用计时器，但我无法触发
。hover
。
由于这可能无法回答您最初的问题，我问自己，为什么不在这个用例中使用CSS

以下是一个例子：

更新了CSS转换和悬停延迟的示例：

使用此类HTML：

<ul class="dropdownmenulist">
    <li><a href="#">What we do</a>

        <ul>
            <li> <a href="/blah">Web design & development</a>

            </li>
            <li> <a href="/blah">Web hosting</a>

            </li>
            <li> <a href="/blah">Branding</a>

            </li>
            <li> <a href="/blah">Digital Marketing</a>

            </li>
            <li>
<a href="/blah">Software Development</a>

            </li>
        </ul>
    </li>

    <li><a href="#">What we do</a>

        <ul>
            <li> <a href="/blah">Web design & development</a>

            </li>
            <li> <a href="/blah">Web hosting</a>

            </li>
            <li> <a href="/blah">Branding</a>

            </li>
            <li> <a href="/blah">Digital Marketing</a>

            </li>
            <li>
<a href="/blah">Software Development</a>

            </li>
        </ul>
    </li>
</ul>































元素完全隐藏（显示：无），除非它可见，否则不会触发鼠标事件。我正在用鼠标在菜单按钮上更改它，并使其可见。。但从那以后什么都不会触发。。li a悬停运行正常（下拉菜单列表），但悬停不会触发，因为我希望在鼠标离开和fadeTo（2000,0）后有一个延迟（计时器）；我希望你会这样说；）干得好：
<ul class="dropdownmenulist">
    <li><a href="#">What we do</a>

        <ul>
            <li> <a href="/blah">Web design & development</a>

            </li>
            <li> <a href="/blah">Web hosting</a>

            </li>
            <li> <a href="/blah">Branding</a>

            </li>
            <li> <a href="/blah">Digital Marketing</a>

            </li>
            <li>
<a href="/blah">Software Development</a>

            </li>
        </ul>
    </li>

    <li><a href="#">What we do</a>

        <ul>
            <li> <a href="/blah">Web design & development</a>

            </li>
            <li> <a href="/blah">Web hosting</a>

            </li>
            <li> <a href="/blah">Branding</a>

            </li>
            <li> <a href="/blah">Digital Marketing</a>

            </li>
            <li>
<a href="/blah">Software Development</a>

            </li>
        </ul>
    </li>
</ul>