Tagged: , , ,

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • March 10, 2015 at 10:50 pm #409585
    webacom

    Hello, we’re having issues with the responsive menu. We are using the mega-menu feature and when viewed on mobile, only part of the menu will display. Everything is up to date (wordpress, theme, plugins). I’ve troubleshooted by disabling all plugins, but the issue still persists.

    Any suggestions would be greatly appreciated. Thanks!
    Kandace

    March 11, 2015 at 3:03 pm #409858
    Yigit

    Hey webacom!

    You have following code in Quick CSS 

    .avia_mega_div.twelve.units {
  width: 1100px !important;
  right: -500px !important;
}

    Please change it to

    @media only screen and (min-width: 767px) {
.avia_mega_div.twelve.units {
  width: 1100px !important;
  right: -500px !important;
}}

    Cheers!
    Yigit

    March 11, 2015 at 7:23 pm #410052
    webacom

    Thank you! Had to do a couple more tweaks but that fixed the mobile menu perfectly. The only issue now is that the Gallery menu slides off the side of the screen. It looks great on my desktop 1920 resolution screen, but anything below 1550 and that menu slips off the side of the screen. The Procedures menu seem to work as it should, which is weird as they are right beside one another and both mega-menus. Any suggestions?

    Thanks again.
    Kandy

    March 11, 2015 at 11:40 pm #410192
    Yigit

    Hey!

    Can you please post a screenshot and show the issue please? I could not find Gallery menu item on your website Kandy

    Best regards,
    Yigit

    March 12, 2015 at 1:44 am #410245
    webacom

    Hey Yigit,
    The menu behavior changed when I went back to take the screenshot, and instead of the “Before & After” mega-menu sliding off the edge of the screen, it’s now the “Procedures” mega-menu. The resolution it’s sliding off at now is 1024×768. Here’s the screenshot:

    The other issue is that the menu is too long on lower resolutions, and a viable solution for us is to just force the mobile menu at certain lower resolutions, and at other slightly lower resolutions, simply force them main menu to go BELOW the logo rather than overlap it. Here’s the screenshot:

    So I guess in summary, how would I force the mobile menu on resolutions widths of 912 or less (when the menu starts to wrap to the next line), and how would I stop the menu from overlapping the logo at 913 or greater?

    Thanks again for your help.
    Kandy

    March 12, 2015 at 1:48 am #410246
    webacom

    Screenshots didn’t show up in the post, so here’s the links:
    1. https://www.dropbox.com/s/vgxpmm456i3zrt4/screenshot-11-03-2015-.jpg?dl=0
    2. https://www.dropbox.com/s/l4zgv1djzju2emg/768×1024.jpg?dl=0

    March 12, 2015 at 4:01 pm #410517
    Yigit

    Hey!

    Please go to Enfold theme options > Header > Mobile Menu > Header Mobile Menu activation and choose 990px.

    Cheers!
    Yigit

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.