Problem with Sub-Menus on Mobile, also on Hueman’s Demo Site

  • Today I discovered a strange behaviour with the sub-menus. It can easily and consistently be reproduced on the official Hueman demo page, https://demo-hueman.presscustomizr.com

    When using a computer, the menus seem to work as they should. Not so with a tablet or a phone. I have tested both Hueman’s demo site and my site with Safari on a 2019 iPad Mini and an older iPhone.

    Description:
    First, scroll to the bottom.
    When using a tablet, tap on “Categories” in the footer menu. Since “Categories” has a sub-menu, it should open/unfold to reveal the sub-menu content (in this case: 5 different categories). But it doesn’t. Instead, immediately after tapping on “Categories” the browser quickly jumps all the way to the top of the page.

    If I manually scroll to the bottom again, I can see that the “Categories” sub-menu has unfolded in the footer menu. The problem is obviously that the page jumps to the top first, which surely is not the way it’s supposed to be.

    Same thing happens on my iPhone, this time accessing the footer menu items via the hamburger icon first.

Viewing 4 replies - 1 through 4 (of 4 total)
  • Thread Starter yallaman

    (@yallaman)

    I was wondering if this GitHub issue (#913) is related to my bug report? If so, it seems theme author @nikeo recently closed it since he could not reproduce it.

    The problem/bug with the submenu on tablets has not disappeared. Today I asked two of my friends (with iPads) to test Hueman’s demo site on https://demo-hueman.presscustomizr.com. They both confirmed that the submenu does not work.

    It is very easy to reproduce:
    First, scroll to the bottom of the demo site, then tap on “Categories” in the footer menu, and watch what happens.

    Since “Categories” is a submenu, it should open/unfold to reveal the submenu content (in this case: 5 different categories). But it doesn’t. Instead, the browser quickly jumps all the way to the top of the page. I have the same issue with the submenu on my website.

    Theme Author presscustomizr

    (@nikeo)

    Thanks for those details.
    The scroll to top can be prevented by changing the url of the link from ‘#’ to ‘#.’
    Also note that the scroll to top does not happen when a user taps on the arrow next to the menu item link.

    Thread Starter yallaman

    (@yallaman)

    Thank you very much! Adding “.” after the “#” fixed it. I see that you have already updated the demo site. I tried googling the issue, but could not find a solution.

    One final note about using the submenu on tablets:
    When tapping a submenu item, e.g. the newly fixed “Categories” on https://demo-hueman.presscustomizr.com, an “overlay” appears displaying the submenu items. However, if the visitor does not find what he/she is looking for and wants to close the overlay/submenu, there is no way to achieve this. The submenu overlay stays open, and the only way to get rid of it is to select an item in the submenu – which is sometimes not what the visitor wants.

    Is there a way to make it possible for visitors to close the submenu (for example by tapping the submenu again)?

    Theme Author presscustomizr

    (@nikeo)

    I’m exploring this

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Problem with Sub-Menus on Mobile, also on Hueman’s Demo Site’ is closed to new replies.