Change hover to active When Using A Touch Enabled Device

[bmoneruiux]

Hey guys. I have 2 versions of my logo. One that animates on hover, and another that animates when active. Since people use touch enabled mobile devices a lot these days, I was planning on just using the active one, but then I got to thinking…

Is there a way to swap out hover with active using jQuery when it detects a touch enabled mobile device?

hover

See the Pen Simple CSS3/HTML5 Logo Pt2 by Brandon Harris (@ctvonline) on CodePen.

<script async src=”//codepen.io/assets/embed/ei.js”></script>

active

See the Pen Simple CSS3/HTML5 Logo Pt2 by Brandon Harris (@ctvonline) on CodePen.

<script async src=”//codepen.io/assets/embed/ei.js”></script>

[Paulie_D]

I’m not sure :active is what you want…:focus might be better…isn’t that what’s usually recommended, at least it used to be?

As for Jquery(Mobile), i think you need to script tap/touchevents

I hesitate to link in W3Schools but : http://www.w3schools.com/jquerymobile/jquerymobile_events_touch.asp

or http://api.jquerymobile.com/category/events/

[Author]

Posts