Hey Tom, I would take any styling off of the hover states of your links so they are blank on hover and then create a class from that hover state you previously had and with a jQuery helper function, add and remove the class if it is mobile.
I wrote up a quick example that works, or it works on my iPhone5 anyway. Don't have an Android device or tablet of any kind atm. View the source for the code. http://designdrumm.com/NoHoverOnMobile.html Best, Karl DeSaulniers Design Drumm http://designdrumm.com On Jan 9, 2016, at 9:45 PM, Tom Livingston <tom...@gmail.com> wrote: > My point wasn't to mimic hover on mobile. I was asking how to set up hover > for desktop but avoid having them fire on some mobile devices needlessly. > Putting hover styles a a wide desktop breakpoint isn't foolproof but seems > the least convoluted. Any other ideas? > > > > On Saturday, January 9, 2016, Karl DeSaulniers <k...@designdrumm.com> wrote: > 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/ > > > -- > > 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/
