You don't. You can but that is a little silly IMO. Hover is a mouse event meant for interaction with a mouse. Until the screen can detect your finger hovering over it, there is no need to set hover for mobile. I know this statement may come with a backlash from some evangelicals, however think about it. Do you put wings on a car just because you can? Just for looks?
Design for your device. Leave the mouse events for the mouse and the click events for mobile to turn into tap events. If you really must have hover events on mobile, then javascript/jQuery is the way to go. it includes setting a timeout to see if their finger has stayed on the screen for so long past a click. Best, Karl DeSaulniers Design Drumm http://designdrumm.com On Jan 8, 2016, at 9:49 AM, Tom Livingston <tom...@gmail.com> wrote: > List, > > How do you handle hover events on touch 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. 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 > > -- > > Tom Livingston | Senior Front End Developer | Media Logic | > ph: 518.456.3015x231 | fx: 518.456.4279 | medialogic.com > > > #663399 > ______________________________________________________________________ > 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/ ______________________________________________________________________ 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/
