By default, the plugin will prepend the menu to the
BODY and hide it from sight.
When the menu is being opened, the page slides out of view, revealing the menu and blocking the page from interaction.
In other forms, the menu can be revealed by sliding in view, hiding the page behind it.
This kind of behavior is called an "off-canvas" menu.
An "on-canvas" menu on the other hand, is always opened and visible.
It is not prepended to the
BODY and will not slide out the page.
If you want an on-canvas menu, you need to prevent the plugin from doing its default off-canvas behavior. You can do this in two different ways.
1. Include only the jQuery.mmenu.oncanvas .js and .css files instead of the jquery.mmenu .js and .css files:
2. Set the
offCanvas option to
Note that an on-canvas menu has
width: 100%; and
As mentioned, an off-canvas menu is the default behavior for the plugin. To achieve this behavior, the jquery.mmenu .js and .css files are a combination of the core and the "offCanvas" add-on files.
If you want an off-canvas menu, follow the tutorial.
In the left example, the
offCanvas option is set to
this disables the "offCanvas" add-on and results in an on-canvas menu.