Anchor links in mobile navigation

mahtiniko
(@mahtiniko)

1 year, 7 months ago

Hi,

It seems that at some point the anchor links in mobile navigation have stopped working.

The navigation works fine on desktop, but on mobile view if the link contains a #-mark, pressing it just closes the navigation and nothing happens.

It seems that there has been plenty of discussion regarding similar anchor link problems in the past.

Kind regards,
Niko

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

Viewing 4 replies - 1 through 4 (of 4 total)

Thread Starter mahtiniko
(@mahtiniko)

1 year, 7 months ago

This only seems to be happening if Cuztomizing -> Header -> Mobile Menu -> Mobile Menu Style: “Full Screen” is selected. So the bug doesn’t exists for Sidebar or Drop Down mobile menu styles.
Thread Starter mahtiniko
(@mahtiniko)

1 year, 7 months ago
I think I found the reason:
oceanwp/assets/src/js/theme/mobile-menu/full-screen-mobile-menu.js
```
    document
      .querySelectorAll(
        '#mobile-fullscreen .fs-dropdown-menu li a[href*="#"]:not([href="#"]), #mobile-fullscreen #mobile-nav li a[href*="#"]:not([href="#"]), #mobile-fullscreen a.close'
      )
      .forEach((menuItemLink) => {
        menuItemLink.addEventListener("click", this.#onCloseIconClick);
      });



  #onCloseIconClick = (event) => {
    event.preventDefault();
    if (event.currentTarget.getAttribute("href").substring(0, 1) === "#") {
      event.preventDefault();
    }

    this.#closeMenu();
  };
```
It seems to just close the menu and then prevent the default action for all the links where # is included? Wonder what has been the point? Why not just use “#mobile-fullscreen a.close“?
Shahin
(@skalanter)

1 year, 6 months ago

Hello @mahtiniko,

Thank you very much for your report,
This topic is forwarded to the developer team and will be checked, and it will be fixed/improved for the next updates.

Best Regards
heinzoellrich
(@heinzoellrich)

1 year, 6 months ago
Good day

I face the same issue

desktop menu anchors works fine but not working at all in mobile

Oceanwp latest version, elementor pro

http://www.staging.butterflycreativeconcepts.com/

See about us menu for reference please

Regards

HEinz
- This reply was modified 1 year, 6 months ago by heinzoellrich.