For my right menu, I have offcanvas and mm-slide enabled, but my menu shows in overlay rather than pushing the body left. I can't figure out why it doesn't behave like the demo. Any thoughts?

Menu Overlay

CommentFileSizeAuthor
#4 mmenu-js.jpg19.59 KBcybermache
#3 mmenu_settings.png34.76 KBCyberPunX
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

cybermache’s picture

I got this to work by wrapping my page.tpl.php content with <div class="mm-page">. Of course if you already have a top level div tag for your page content simply adding the mm-page value for it's class should work too.

brandy.brown’s picture

I tried adding that class, but it still doesn't push for me: (

CyberPunX’s picture

FileSize
34.76 KB

Under "MMENU OPTIONS" find "OFFCANVAS (ADD-ON)", then under "zposition" set "next"
(The z-position of the menu relative to the page. Possible values: "back", "front" or "next".)

That did it for me!

cybermache’s picture

FileSize
19.59 KB

@brandy.brown, I don't have mm-slide turned on. I found it worked weird and preferred the instant slide open when it was disabled.

I guess the only thing I can suggest or ask is, can you confirm the template file you are using is involved in your page's output. As in, is your theme using it to build your pages. If it is (you see the div wrapper of mm-page when looking at the page source) are all of your pages content (body, header footer) found within that wrapper? If they are, are the module's js files installed correctly?

Without knowing more of your site's construction that's all I can think of. Hope it helps.

ryivhnn’s picture

"Me too" type comment, none of the aforementioned suggestions want to work for me either, still quite stubbornly stuck in overlay mode. Least it does close by itself, the description on the configuration form said otherwise :)

@brandy.brown did you ever find a solution?

brandy.brown’s picture

Thanks @cybermache, I double checked your suggestions, but everything seems to be correct. The js is good to go and all of the page's content is inside the wrapper mm-page.

I haven't found a solution yet, but I will report back when I do.

brandy.brown’s picture

Ok so I finally had a chance to look at it again and have found a solution
---
The following settings:
Disable mm-slide
Enable off-canvas
zposition: next
wrap main content in <div class="mm-page"></div>

... do allow it to push.

However, my problem is the addition of a div at the end of my page.
<div id="mm-blocker"></div>

Removing this allows for expected behavior

tsmulugeta’s picture

I'm also having the same issue: http://stage.vi.com/ Please advise

CyberPunX’s picture

Well, I got it to work with the Omega theme (3.1).
After doing the above mentioned changes (Under "MMENU OPTIONS" find "OFFCANVAS (ADD-ON)", then under "zposition" set "next") I also changed:
under "SHOWMMENU CONFIGURATIONS" find "OFFCANVAS (ADD-ON)", and for "pageSelector" set "#page".

I think mmenu needs a jquery div/element selector ( in "pageSelector" ) to know which div to transform... A div with all page content, except the mmenu itself...
My html:

<body class="html front not-logged-in page-node page-node- page-node-1 node-type-page omega-mediaqueries-processed responsive-layout-mobile">
<div id="omega-media-query-dummy"></div>
<nav id="mmenu_left" class="clearfix mm-menu mm-horizontal mm-fresh mm-offcanvas mm-next mm-current mm-opened"><!-- mmenu content  --></nav>
<div id="skip-link"></div>
<div class="page clearfix mm-page mm-slideout" id="page">
  <!-- normal page content  -->
  <header id="section-header" class="section section-header"></header>
  <section id="section-content" class="section section-content"></section>
  <footer id="section-footer" class="section section-footer"></footer>
</div>
<div class="region region-page-bottom" id="region-page-bottom"></div>
<div id="mm-blocker" class="mm-slideout"></div>
</body>

PS #mm-blocker is translucent element covering normal page content when mmenu is expanded (and clickable te retract mmenu) (I think ;) )

brandy.brown’s picture

@CyberPunX Thanks for the response. I think the mm-blocker makes sense unless you are using the "modal" option (where you have to provide a close button)... which is the case for me.

@tsmulugeta I don't see where the collapsed menu trigger is on the page you provided. When I pull the screen down smaller, there's no menu and no trigger. Let me know.

gmaxwelled’s picture

I got this to work using a slightly different set of conditions:

- MMENU OPTIONS -> Disable mm-slide
- MMENU OPTIONS -> Enable off-canvas
- MMENU OPTIONS -> OFF-CANVAS (ADD_ON) -> zposition: next
- in page.tpl.php, wrapped main content in
<div id="mm-page"></div>
- MMENU CONFIGURATIONS -> OFF-CANVAS (ADD-ON) -> pageSelector: #mm-page

So using a class didn't work for me, I had to use the selector.

As described above, it's still showing the translucent layer (whether or not Modal is enabled), so I think the next step will be to remove
<div id="mm-blocker"></div>
if I want to use my menu button to close the menu instead.

BenMirkhah’s picture

Had the same issue, tried the above fixes but it wasn't working because I unintentionally had both the left and right menu enabled in the config, turning one off made the fix work.

Volker23’s picture

I got the push feature working following the instructions on #11. But still:
1. there's the overlay (modal setting is "off"). Did anyone get this to work without the modal overlay somehow?
2. the menu items aren't working (nothing happens on click)

Any help highly appreciated!

evets33’s picture

hi brandy.brown, have you succeeded ?

MrPaulDriver’s picture

Thanks #11 worked for me

tsmulugeta’s picture

#11 worked for me also. Thanks @gmaxwelled

afagioli’s picture

Status: Active » Fixed
afagioli’s picture

Status: Fixed » Closed (fixed)