相同DIV(移动设备)上的jQuery Hover / Click事件

时间:2012-06-27 03:14:29

标签: javascript jquery mobile click hover

我写了一个简单的脚本,在图像上显示圆圈。

  1. 当您将鼠标悬停在圆圈上时,它会展开为工具提示。

    $('div.tooltip').live({mouseenter:function(e){
    ... animate tooltip open;
    },mouseleave:function(e){
    ... animate tooltip closed;
    }});
    
  2. 当您点击打开的工具提示时,它会显示一个包含更多信息的灯箱。

    $('div.tooltip').live('click',function(e){
    ... open related lightbox
    });
    
  3. 除移动设备外,一切正常。当我点击圆圈打开工具提示时,它会触发click事件并完全绕过mouseenter/mouseexit个事件。 任何想法将不胜感激:)谢谢

1 个答案:

答案 0 :(得分:2)

由于触摸屏设备的性质,他们根本不支持悬停事件。在这方面你可以做的最好的是使用支持手势的jquery插件并使用单击和双击事件,否则你需要将工具提示放在其他地方并使其始终可见或者只有一个单独的按钮激活提示...或者你可以这样做,所以第一次点击激活按下然后下一次点击激活第二个功能。