带有 div 而不是 ul 的 Jquery mmenu 子面板

Question

我正在使用出色的 Jquery mmenu 插件来创建滑动菜单。我有一个带有 li 标签的 ul 普通菜单和带有 ul 和 li 的子菜单工作正常，但我希望有一个更像是具有一般内容的子面板的子菜单。我无法让它像子面板一样滑入。

这是代码的sn-p：

<nav id="my-menu">
<ul>
    <li><a href="/">Home</a>
    </li>
    <li> <a href="/about/">About with ul THIS WORKS FINE</a>
        <ul>
            <li><a href="/about/history/">History</a>
            </li>
            <li><a href="/about/team/">The team</a>
            </li>
            <li><a href="/about/address/">Our address</a>
            </li>
        </ul>
    </li>
    <li> <a href="#div-slide">About with div HOW CAN I GET THIS TO SLIDE IN??</a>
    </li>
</ul>
</nav>
<div style="display:none">
    <div id="div-slide">
        <h1> About </h1>
        <a href="#"> close </a>
    </div>
</div>

<div id="header"> <a class="menu-icon" href="#my-menu"></a>

</div>
<div></div>

这是一个 jsfiddle。 http://jsfiddle.net/4xQw6/1/

我找到了这个解决方案，它非常适合打开 div 面板。但是，关闭 div 面板的 href="#mm-m0-p0" 感觉就像一个未记录的 hack。应该有更好的办法。

<nav id="my-menu">
<ul>
    <li><a>Home</a></li>
    <li>
        <a href="#">Login</a>
        <div class="Panel">                      
           <a class="close" href="#mm-m0-p0">X</a> 
           <h3>Login form...</h3>
        </div>
    </li>
</ul>

Answer 1

您不需要使用 div。您可以根据需要简单地设置li 的样式。向li 添加一个css 类，并应用所需的格式。

.liClass {
  display:block; // this will make the li behave like a div
  // add extra formatting here
}

我不希望 li 看起来如何，但你可以使用适当的 CSS 样式来完成它。