Mobile menu is cut off when I click to show sub-menu

  • Resolved saulwpwd

    (@saulwpwd)


    4 years, 1 month ago

    Hi,

    When viewing this site on mobile, and a menu option is clicked to expand and show some sub-menu links, the bottom of the list is cut off and cannot be seen unless the sub-menu is collapsed.

    I have searched for an answer and see that you advise that if headers are sticky, it can cause this problem.
    I am using Elementor Pro to create my header but it is not set as sticky.

    I also see you advise to add this code:
    https://www.megamenu.com/documentation/fixed-height-mega-sub-menu/
    Which should add a scroll bar on the side – I would rather not have a scroll bar and just be able to scroll down the menu, but even with trying this code, it does not work.

    Can you please advise?
    Thanks

    The page I need help with: [log in to see the link]

Viewing 8 replies - 1 through 8 (of 8 total)
  • Plugin Author megamenu

    (@megamenu)

    Hi Saul,

    Thanks for posting a link.

    Have you fixed this already? I checked on mobile and can scroll up and down:

    Regards,
    Tom

    Thread Starter saulwpwd

    (@saulwpwd)

    Hi Tom,

    Thanks for getting back to me.

    My screen scrolls like the above, but there are links for Twitter and YouTube that are below Instagram.

    Like your screen above, they get cut off when a sub menu is expanded.
    We would need to still be able to scroll all the way down and see Twitter & YouTube even while a sub menu is expanded.

    Thanks,
    Saul

    Plugin Author megamenu

    (@megamenu)

    Hi Saul,

    It looks like you have the “Hide item on mobile” option enabled for those items, if you uncheck that they should show up.

    Regards,
    Tom

    Thread Starter saulwpwd

    (@saulwpwd)

    Hi Tom,

    I have 4 social media links on my menu, that I use in my desktop design and these 4 are hidden on mobile.

    I have the same 4 links, duplicated to show on mobile but hidden on desktop, as I want icons and text to show on my mobile version.

    The 4 icons with text are all visible on mobile, I can see them all when all sub menus are collapsed.
    It’s just that when a sub menu is expanded, the last 2 links on my menu are pushed off my screen and can then no longer be seen, even if I try scroll my screen down.

    Thanks,
    Saul

    • This reply was modified 4 years, 1 month ago by saulwpwd.
    Plugin Author megamenu

    (@megamenu)

    Hi Saul,

    When I looked yesterday I’m fairly sure you had “hide on mobile” enabled for the mobile Facebook and YouTube items (I spotted you have 2 sets of 4 – one set for mobile, one for desktop). Today I’m seeing all of the links visible:

    If you’re still having problems can you post a screencast of what you’re seeing? You can use software called “jing” to record videos and post them here.

    Regards,
    Tom

    Thread Starter saulwpwd

    (@saulwpwd)

    Hi Tom,

    I recorded my screen on my phone and uploaded the video here:

    As you can see, when I expand the “news” menu, the YouTube link gets pushed off the screen but I cannot scroll down to it.
    Same happens with the “teams” menu.

    You can still see the top of the YouTube link when the “club info” menu is expanded, but I still cannot scroll down to see it completely

    Plugin Author megamenu

    (@megamenu)

    Hi Saul,

    Thanks, I see. The bottom bar in the browser window is covering it over. Please to go Mega Menu > Menu Themes > Mobile Menu and set 200px bottom padding on the mobile sub menu.

    Regards,
    Tom

    Thread Starter saulwpwd

    (@saulwpwd)

    Hi Tom,

    That works, menu looks great now!

    Thanks for your help,
    Saul

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Mobile menu is cut off when I click to show sub-menu’ is closed to new replies.