相关疑难解决方法(0)

iPad/iPhone悬停问题导致用户双击链接

我有一些我以前建立的网站,使用jquery鼠标事件...我只是有一个ipad,我注意到所有鼠标悬停事件都是通过点击转换...所以例如我必须做两次点击而不是一次..(第一次悬停,比实际点击)

有解决方法吗?也许是一个jquery命令我shoudl已经使用而不是鼠标悬停/出去等..谢谢!

jquery mouseover hover ipad

121
推荐指数
5
解决办法
14万
查看次数

禁用移动浏览器上的悬停效果

我正在编写一个旨在从台式机和平板电脑上使用的网站.当从桌面访问它时,我希望屏幕的可点击区域点亮:hover效果(不同的背景颜色等).使用平板电脑,没有鼠标,所以我不想要任何悬停效果.

问题是,当我在平板电脑上点击一些东西时,浏览器显然有某种"隐形鼠标光标",它移动到我点击的位置,然后将其留在那里 - 所以我刚刚点击的东西点亮了悬停效果,直到我点击其他东西.

我在使用鼠标时如何获得悬停效果,但在使用触摸屏时抑制它们?

如果有人想提出建议,我不想使用用户代理嗅探.同样的设备可能同时具有触摸屏和鼠标(今天可能不常见,但将来会更加如此).我对该设备不感兴趣,我对它目前的使用方式感兴趣:鼠标或触摸屏.

我已经尝试挂钩touchstart,touchmovetouchend事件,并呼吁preventDefault()对所有的人,这确实抑制"隐形鼠标"的一些时间; 但是如果我在两个不同的元素之间来回快速点击,经过几次点击它就会开始移动"鼠标光标"并点亮悬停效果 - 这就像我preventDefault并不总是很荣幸.除非必要,否则我不会厌倦你的细节 - 我甚至不确定这是正确的方法; 如果有人有更简单的解决方案,我会全力以赴.


编辑:这可以用沼泽标准的CSS :hover重现,但这里有一个快速的repro供参考.

<style>
  .box { border: 1px solid black; width: 150px; height: 150px; }
  .box:hover { background: blue; }
</style>
<div class="box"></div>
<div class="box"></div>
Run Code Online (Sandbox Code Playgroud)

如果你鼠标悬停在其中任何一个框上,它将获得我想要的蓝色背景.但是如果你点击其中任何一个盒子,它也会得到一个蓝色背景,这是我试图阻止的事情.

我还在这里发布了一个示例,它可以完成上述操作并且还可以挂钩jQuery的鼠标事件.您可以使用它来查看点击事件也会触发mouseenter,mousemove以及mouseleave.

javascript hover touch

111
推荐指数
6
解决办法
10万
查看次数

标签 统计

hover ×2

ipad ×1

javascript ×1

jquery ×1

mouseover ×1

touch ×1