0

I've built a custom menu with mmenu (http://mmenu.frebsite.nl/). According to the documentation, any link to the page itself - e.g. <a href="#anchor">Close Menu</a> will trigger the close function. However, as soon as your menu contains anything besides an unordered list (e.g. divs, text, etc) this functionality stops working. As does the menu's automatic styling of ul/li into nice menus. Basically mmenu says "eek, something besides ul/lis - I'm throwing out my default behavior".

Clicking within the page area still works to close the menu. It's only my "Close Menu" link inside the menu itself which doesn't work. And again, removing all non-ul/li content causes the link to start working again.

Anyone have experience with this plugin and have any idea how to get this functionality working?

Bob Meador
  • 155
  • 4
  • 8

3 Answers3

0

The mmenu plugin has an option "isMenu" that determines whether or not to add the menu-specific styling and functionality. If omitted, the plugin will try to detect this option automatically. Basically, if your menu (the NAV) contains only one childnode and that childnode is an UL, the plugin will set the "isMenu" option to true;

Try adding the option manually:

$("#foo").mmenu({
    isMenu: true
});

To close the menu manually, trigger the "close" custom event. How to do this is explained in the tutorial which is included in the download pack.

Fred
  • 512
  • 3
  • 6
  • Unfortunately triggering the "close" event isn't working. I'm using `$('#burger-menu').mmenu();` to create the menu and then trying `$('.menu-close').bind('click', function() { $('#burger-menu').trigger('close'); });`, and the function is triggering on click but the menu doesn't close. – Bob Meador Oct 14 '13 at 17:09
  • Hmm - adding the "isMenu" option DOES make trigger('close') work. But it also forces the menu to be formatted like a menu. Since mine is pretty custom - combination of ul, buttons and other links - that is a less-good option. Any handy way to use isMenu but only for the show/hide functionality - not for formatting of the menu contents? – Bob Meador Oct 14 '13 at 17:18
0

I used this method and it is working great:

$('#manualCloseBTN').bind('click', function() { $('#openedPage').trigger('close'); });

I spent hours searching for an alternative but this is the best way to close the page.

0

You could write your own add-on and load it while initiating the menu.

Inside the add-on you'll have the possibility to bind an event-listener to your "close"-button which calls the close() function:

(function( $ ) {

    var _PLUGIN_ = 'mmenu',
        _ADDON_  = 'myAddon';


    $[ _PLUGIN_ ].addons[ _ADDON_ ] = {

        // ...

        setup: function() {
            var that = this;

            $('#closeButton').on('click', function(){
                that.close();
            })

        },

        // ...
    };

    // ...

});

Just take a look at the existing add-ons and the official website if you need more information...

ben10
  • 1
  • 1