MR1
Simulating :hover functions on iOS
Just wondering if anyone knows of a hack to simulate hover functions on iOS so when you touch an element it gives the hover function.
I'm basically changing a background-image using :hover. It works fine on Android when I touch the element, it works on some desktop and webmail clients when I hover, it's just iOS giving me problems.
I'm not worried about 100% compatibility as it's going to be hidden behind a webkit media query, I just need a work around for iOS.
I've tried adding :active and :focus but iOS isn't recognising any of it.
Any thoughts?
So after some further testing I found it only works for iOS when I use :focus on a clickable element e.g. <a> or <button>
Typical spend ages trying to work this out then as soon as I post a question I find an answer...
It looks like iOS only supports :hover on clickable elements.
I'll have another go next time I get my hands on an iPhone.