OM Maximenu integration

Hi Stan,

I'm not sure where to begin with styling. I know how to change the CSS to make the background black. But I don't know how to keep the OM Menu within the container. Can I do everything with CSS? Or do I need to play with php either in page.tpl.php or template.php?

The OM main menu doesn't transition correctly from horizontal to vertical. See below:-

Possibly Jeff Burnz suggestions for Menu Minipanels, using hook_page_alter(), might work? I did try them with Minipanels, but I got a function error. And Minipanels doesn't play nice with DHTML or jquery Menu modules.
http://adaptivethemes.com/menu-minipanels-in-adaptivetheme-instant-mega-...
Although I'm not sure where to find the machine name for my OM Maximenu.

Another reason I discounted Minipanels is that I couldn't get them to activate using touch on Android (version unknown). I also tried superfish but couldn't get it to activate via touch either. But even if Superfish did work I'm not so keen on how it puts out menus. I also looked at Gigamenu and Muchomenu. No joy with Giga, and I didn't try Muchomenu because it relied on Mini Panels.

Any suggestions?

Regards,
John

I'm getting some joy playing with CSS.

.om-maximenu.om-maximenu-main-menu ul.om-menu li.om-leaf .om-link {
    color: #FCFCFC;
    background: none;
    display: block;
}

#menu-wrapper {
    color: #666666;
    background-color: #212121;
}

Gets me:-

Which is good. I can work with colours and fonts. Is CSS my route to get the menu items to stay within the menu wrapper?

Perhaps the key is in /sites/all/themes/at-commerce/css/responsive.smartphone.portrait.css and the other responsive.css files and using them to create css for OM Maximenu? Perhaps with:-

@media only screen and (max-width: 480px) {

}

Am I on the right track?

CSS study time it is. I've made a little progress. I have a few overflow issues to work through, the OM Maxi Menu needs to appear on top of the other menu items, and the screen break points need tinkering. I'll get there. I haven't yet seen what AT Commerce's CSS does for it's native menu, maybe that'll throw me a bone.

The following code...

@media only screen and (max-width: 524px) {
.om-maximenu.om-maximenu-main-menu ul.om-menu li.om-leaf .om-link {
    background: none repeat scroll 0 0 #212121;
    width: 300px;
    max-width: 100%
}

#menu-wrapper {
    background: none;
    box-shadow: none;
    top: 1em;
}
}

...gets me:-

Still having trouble getting the maximenu to appear above the other menu links. Inspired by Jeff's post on Twitter style Login box, I tried:-

.om-maximenu.om-maximenu-main-menu .om-maximenu-content {
  position: absolute; 
  z-index: 999; 
}

But no joy. Any ideas?

Hi Jeff,

Thanks for looking in on this. My experimental site is:-

http://johnflower.info/dev2

CSS aggregation is off.

I'm not sure whether it is better to push the other menu items down, or just to overlay the Maximenu. I suspect the former.

BTW using your Sky theme at http://johnflower.org and wrote about how your theme helped me to make my site responsive at http://johnflower.org/blog/responsive-web-design-drupal

Regards,
John

Worst case... can move the Products item to the end of the menu, then the dropdown works fine.

But having it at the top is better for search engines. In which case displacing the other menu items would be best when in the vertical configuration.

Two hours later. No progress. I'm going to have another go with minipanels.

This is my second time trying with Menu Minipanels. the first time I gave up because of an error:-

Attempt to assign property of non-object in ctools_block_content_type_render()

Which was raised as an issue at:-
http://drupal.org/node/1739718
and now has a solution, today it is patch or upgrade to dev version.

I also discounted it because i couldn't get jquery/dhtml expanding menus... but I now think this is not important. So the last thing is to figure out how to show the dropdown when tapping on the menu title. Possibly the Special menu items module is the way.

I've decided to struggle with OM Maximenu no longer. It will take me too long to figure out how to make it work. I'm working with Menu Minipanels instead. Cheers Jeff and Stan.

Corrected spelling