Question

首先，我尝试直接在CSS中创建Dropdownmenu，但它并没有那样工作，因为我使用ASP.NET并生成了html代码。这是我的html代码的jsfiddle：https://jsfiddle.net/rxLg0bo4/2/
这就是我的菜单在ASP中的作用：

<nav id="menu">

            <asp:Panel ID="pnlMenu" runat="server"></asp:Panel>
            <asp:Panel ID="pnlSubmenu" runat="server">
                <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
                </asp:ContentPlaceHolder>
            </asp:Panel>
        </nav>

但是现在我知道我必须使用JavaScript，因为我无法解决其中一些问题，如果你看一下jsfiddle，你就会得到它。
但我真的不懂JavaScript，所以我需要一些帮助。这是一个脚本，我做了：

  $('#pnlmenu').on('click', function click(){
        $('#pnlSubmenu').height(50);});

所以最后我希望它能像以下那样工作：
当你将鼠标悬停在menu1上时，第一个子菜单面板应该通过子菜单下拉。谁能告诉我怎么做？

Answer 1

您可以使用jquery的mouseover和mouseout个事件到fadeIn/fadeOut菜单看到这个JSFiddle来帮助您入门，但是您需要以其他方式解决问题您的子菜单需要切换可见性。

$( "#pnlMenu .menu_link" ).mouseover(function() {
    $(".submenu_panel").css("height", "100px");
    $("#pnlSubmenu").fadeIn( "slow" );
});

$( "#pnlMenu .menu_link" ).mouseout(function() {
    $(".submenu_panel").css("height", "0px");
    $("#pnlSubmenu").fadeOut( "slow" );
});

生成JavaScript以生成下拉菜单

1 个答案: