The language dropdown menu does not work on iOS Safari

[quinncnl]

The top right language dropdown seems to be triggered only by mouseover. On touchscreen device it should accept tap/click.

[kaiiiz]

I've tested this but can not reproduce your situation. The dropdown menu appears when I click the multilingual button.

Can you provide the following information to help me address the issue?

1. Your device information (e.g., iOS, Android)
2. Browser and its version
3. Web page URL

Thanks

[quinncnl]

Hi @kaiiiz ,

I’m on Safari iOS on an iPhone. The issue can be reproduced at https://kaiiiz.github.io/hugo-theme-monochrome/

[kaiiiz]

I found several posts in stack overflow that mentioned this issue.

• https://stackoverflow.com/questions/35187970/css-hover-not-working-on-ios-safari-and-chrome
• https://stackoverflow.com/questions/1823218/how-to-trigger-mouse-over-on-iphone
• https://stackoverflow.com/questions/18047353/fix-css-hover-on-iphone-ipad-ipod

These posts mentioned an onclick="void(0)" or the cursor: pointer tricks that make Safari recognize the hover event. The strangest thing is that, currently, the elements with hover event are all have the cursor: pointer CSS, which means that the trick has already implemented in this theme...

Since I have no iOS device, it's hard for me to find the root cause of the bug. Any assistance from someone experienced in iOS Safari would be greatly appreciated.

[kaiiiz]

I've added a fix in v3.0.0. Can you help confirm whether it works? Thanks!

[quinncnl]

Hi @kaiiiz I can confirm it works perfectly on iOS now. Thanks!