iOS Safari iFrame and Z-Index Bug. Perceived Z index different from interaction z-index

I just ran into an issue with iOS that had me scratching my head. We have a Vimeo integration in an iframe that was playing on click on iOS safari (as evidenced by sound and network) but none of our JS handlers were being triggered.

The same site on Chrome and others would work fine and our JS handlers would be triggered, specifically an image on top of the iframe bound to click.

The problem turned out to be a Z-Index issue but somehow, the apparent/perceived/visible z-index was different from the interaction/touch/collision detection z-index. Increasing the Z-Index on the ​image gave it the priority it needed to be clickable.


Leave a Comment

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s