Change Hover Interaction To Click For Touch Screen Devices
I have content revealing on hovering over another element on the page. On a touch screen this needs to be a click. I know that iOS and Android translate hover action on a link to a
Solution 1:
Okay, you're going to want to define your event (you can do it based on the no-touch class) before you do anything. From there, I just opted to toggle a class, which will still allow for your CSS transitions.
$('body').hasClass('no-touch') ? event = 'mouseenter mouseleave' : event = 'click';
//!$('body').hasClass('no-touch') ? event = 'mouseenter mouseleave' : event = 'click';
$('div div').on(event, function() {
$(this).find('p + p').toggleClass('open');
});
You can see it both ways if you comment out the first line then uncomment the second.
Post a Comment for "Change Hover Interaction To Click For Touch Screen Devices"