jQuery Hover/Click event on same DIV (Mobile Devices)

Posted by Aaron on Stack Overflow See other posts from Stack Overflow or by Aaron
Published on 2012-06-27T03:14:29Z Indexed on 2012/06/27 3:15 UTC
Read the original article Hit count: 89

Filed under:
|
|
|
|

I've written a simple script that displays circles over an image.

  1. When you hover over a circle it expands to a tooltip.

    $('div.tooltip').live({mouseenter:function(e){ ... animate tooltip open; },mouseleave:function(e){ ... animate tooltip closed; }});

  2. When you click on the open tooltip it displays a lightbox with more information.

    $('div.tooltip').live('click',function(e){ ... open related lightbox });

Everything works as it should, except on mobile devices. When I tap the circle to open the tooltip it fires the click event and completely bypasses the mouseenter/mouseexit events. Any ideas would be greatly appreciated :) Thanks

© Stack Overflow or respective owner

Related posts about JavaScript

Related posts about jQuery