Tablet issue menu

Hi,

On this website - http://www.greeneve.eu/home/ - on my iPad it shows the inline navigation. While two of the three menu items with a drop down have a custom link as top link, the home-menu item is a regular page. However, on the iPad it’s not clickable: you can only click the one sub-item underneath it.
I think I can remember something about this being some sort of mobile issue but I’d really like it to be selectable.

Hello @yingfuli,

Thanks for writing in!

Please edit your header and in your navigation settings, please make sure that your sub menu trigger is set to the “Sub Indicator”.

We would loved to know if this has work for you. Thank you.

I can’t because it concerns the inline navigation, not the navigation modal. In the navigation inline it doesn’t have that option.

Hi @yingfuli,

The inline menu is meant for the desktop since it’s made for hover functionality and not for touch. The sub-menu is always triggered by hover on desktop view. I recommend displaying a mobile menu on tablet, like navigation modal, collapse, layer, and likes.

Thanks!

I have it enabled for desktop and laptop only. The smaller viewports have a navigation modal. However, when you use the iPad in landscape mode it still uses the laptop viewport, regardless of it being touch device. It is in my opinion a rather annoying oversight in how Pro (though probably other themes as well) handles devices.
So my next question would be how to accomplish that the iPad in landscape mode switches to the navigation modal?

Hi @yingfuli,

I tried and it’s a bit complex, the tablets even surpass the desktop resolution while the browser has no CSS feature that detects the touch device.

You should add a mobile menu on tablet regardless of orientation which yes, also means you have to apply it on the laptop device.

Thanks!

Hm, okay. Looks to me like this should be top of the list of things to work out. I guess many more have the same issue since mobile first is in effect.

Hi @yingfuli,

Yes, I agree and it’s been added to our issue tracker as a feature request. But it’s currently impossible since you could only detect a device by its screen width (either landscape or portrait) and not by touch features. And it’s browser’s limitation that’s why some theme and plugins uses device detection on server side (not CSS) depending on the device information that the browser forwarded to the server. And it’s a bit slower and can be bypassed by private browsing or HTTP Header spoofing.

Thanks!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.