Pro header links not working on mobile

Hey, I have a secondary white menu that scrolls with user https://www.plasticsurgeryholiday.com/clinics/new-templ/
But the anchor links won’t work on android or ios. Works fine on desktop.

Is something wrong with my css z-index or it’s a bug or smth?

1 Like

Hi there,

Thanks for posting in.

It’s working on my mobile, it links and scroll. Or perhaps are you referring to its width? And yes, you should set its z-index to about 99999. Header bar should have z-index option.

Other elements like slider could have greater z-index and will cover your header bar, hence, you should make its z-index greater than the others.

Thanks!

Hmm, thanks. I tried on two androids and one iphone but links did not scroll to row id. I’ll keep testing.

Hello There,

Thanks for writing in! So that it will scroll properly to the targeted element ID, please make sure that the ID is unique. There should not be a duplicate ID. Duplicated IDs could lead to some issues and it will not scroll in smaller screens.

Hope this helps.

Hi, tried it just now https://www.plasticsurgeryholiday.com/clinics/testmenu/ but still white menu not working on my android device. Can you test on yours if u have (or iphone) and tell me if it works?

Hey There,

Would you mind providing us with login credentials so we can take a closer look? Please provide following information:

Set it as Secure Note

  • Link to your site
  • WordPress Admin username / password

All the best!

Sure here it is. Thanks

Hi There,

It seems to be a bug with Content Scrolling vs One Page Navigation.

I have turned off your content scrolling and by doing that your links will scroll to the correct section.

I have replicated the setup on my local installation, and although at the first time it did scroll down, just after that it stopped to work. I will forward the issue to our developers so they can take a look and in case the bug is confirmed it can be fixed.

Thanks for understanding.

i have the same problem, links show fine on desktop and laptop but anything below it will not show.

http://outboxxed.com/
the bar is transparent

Hi @xjonathan_uribex,

Thanks for writing around! I checked your setup and I see you haven’t updated you theme to the latest version.Please update the theme first to avoid potential conflicts.You can find the latest version numbers here: (http://theme.co/changelog/) Then you can compare them to what’s installed on your site.

If you find anything to be out of date, you can review our update guide.

I think I have the same problem… once you click on the burger in chrome (and move the mouse off the browser window quickly… or using a phone, just tap on the burger, the menu displays and is blank… initially I thought it was a ‘flex’ css thing. It seems to be a chrome thing…

not ideal, but I put a css override in.

.x-off-canvas {
visibility:visible !important;
}

so far, it doesn’t effect anything else (since the whole menu is moved off canvas anyway…).

Fingers crossed.

Felix

Hi there,

I just checked and I don’t see or can’t reproduce this issue on my install, but glad you have a workaround and it should be good since off canvas is only available in the header area. It will only affect other off canvas, but I’m sure you’ll not use them more than twice.

Thanks for sharing!