Tom Livingston wrote:
List,
How do you handle hover events on touch devices?
Currently I don't. Until you brought this to my attention, I hadn't
considered how problematic the :hover property could be on touch screen
devices.
For example, a button whose bg color changes on hover. On iOS, the
hover change happens on tap. Not really a big deal but I'm not a fan
of this personally.
At my site http://www.thetangos.com/ the main navigation links should
only display a text color change on hover. However after reading this
post I noticed that for some reason yet to be discovered my Andriod 4.3
device will also show a momentary background-color change as well as the
text color change on tap. I wasn't expecting to see the
background-color change.
Is it just a matter of moving the hover styles to
a wider breakpoint? This seems simplistic, but technically would work
provided you don't mind hover effects not working if you narrowed your
browser window enough. I'd rather not add script just for this issue.
Am I missing another simple solution?
Thanks
I think how simple the solution will be depends on how the :hover
property is used. I found this interesting article this morning,
http://www.prowebdesign.ro/how-to-deal-with-hover-on-touch-screen-devices/
Mike
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
