iPhone issues with Navbar Interactions

[grantsenior]

Hi there,

We’ve got a problem with iPhone XR and XS not liking the Interactions customizing the navbar’s opening action. On this site https://www.moai.net.nz/ these phones are not displaying the navigation list when the navbar slides out initially (according to the client; we can only test on Browserstack where everything is fine, or on lower versions of iPhone where it is also fine).

I have done some testing to track down the problem and built a very simple version of it.
https://navbar-testing.webflow.io/ This time the open navigation button (shown red below) does not appear in these phones. The nav button change is being controlled by an Interaction on the element wrapping the button images.

I thought the issue was z-index related but in the simple test case the nav button has a higher z-index so it should be coming through.

Can anybody take a look to see if I’m doing something wrong? Or is there some sort of bug involved?

Cheers
Grant

---

Here is my site Read-Only for the live site: Webflow - Ministry of Architecture and Interiors

Here is my site Read-Only for the simpler test site: Webflow - Navbar testing

[grantsenior]

This has now been resolved.

The iPhone XR and XS versions were not liking the animated opacity of the listed navigation items that faded in when the mobile navigation slid onto the page. All other phones tested were fine with it (as was Browserstack testing); Solution was to disable that effect.

So not really a fix, and I would say that this is still a bug (?) as the setup was pretty basic, and I’m pretty sure I hadn’t done anything wrong in the way it was put together, just wasn’t working for these phones. But the client is happy again.

Grant