2

尝试使用 jQuery.mmenu 插件。我的菜单中有多个项目。一些链接到页面内的锚标记，其余链接到其他页面。第一次单击指向锚点的链接时，页面导航到锚点并关闭菜单。但是，如果我再次打开菜单并单击另一个指向不同锚点的链接，则页面会导航但菜单不会关闭。我正在使用开箱即用的代码，并且没有更改任何内容。我确定我错过了一些真正简单的东西。任何帮助将不胜感激

菜单

<nav id="menu">
  <ul>
    <li><a href="index.html#how-it-works">How it Works</a></li>
    <li><a href="index.html#businesses">Affiliated Businesses</a></li>
    <li><a href="about.html">About</a></li>
    <li><a href="faqs.html">FAQs</a></li>
     <li><a href="contact-us.html">Contact Us</a></li>
    <li><a href="jobs.html">Jobs</a></li>
  </ul>
</nav>

JS

<script type="text/javascript">
  $(function() {
    $("nav#menu").mmenu({
   classes: "mm-slide"
});
  });
</script>
4

2 回答 2

6

这现在内置在插件中（v5.6.6 2016.07.05）。要正确支持带 #text 的 href（例如，在单页应用程序中），请在激活插件时使用以下选项：

onClick : {
  close          : true,
  preventDefault : false,
}

如：

$("#my-menu").mmenu({
  "slidingSubmenus": false,
  onClick : {
    close          : true,
    preventDefault : false,
  }
});
于 2016-07-05T20:07:40.430 回答
2

首先，我会去掉那些页面锚点中的 index.html。所以;

<li><a href="#how-it-works">How it Works</a></li>
<li><a href="#businesses">Affiliated Businesses</a></li>

也许 mmenu 已经针对页面链接进行了更新，但是当我最近这样做时，“开箱即用”意味着使用此代码（它位于演示代码示例之一 - onepage.html 中）

var $menu = $('nav#menu'),
    $html = $('html, body');

$menu.mmenu({
  classes: "mm-slide"
});

$menu.find( 'li > a' ).on(
    'click',
    function()
    {
        var href = $(this).attr( 'href' );

        //  if the clicked link is linked to an anchor, scroll the page to that anchor 
        if ( href.slice( 0, 1 ) == '#' )
        {
            $menu.one(
                'closed.mm',
                function()
                {
                    setTimeout(
                        function()
                        {
                            $html.animate({
                                scrollTop: $( href ).offset().top
                            }); 
                        }, 10
                    );  
                }
            );                      
        }
    }
);

它if ( href.slice( 0, 1 ) == '#' )用于确定链接是锚点还是指向另一个页面的链接。因此，我建议摆脱这些链接中的 index.html 的原因。

于 2014-05-28T18:57:45.343 回答