javascript - 不要在触摸设备上显示悬停状态

标签 javascript html css touch

这可能吗?如果不将我所有的悬停样式转换为 mouseover 监听器,是否有可能阻止触摸设备触发 CSS 悬停状态?

我有一个应用程序必须在触摸和指针输入上工作,它工作得很好但是应用于悬停的某些样式在触摸设备上没有意义,因为它们往往会在用户点击后无限期地保持悬停状态对象。

注意事项:

  • 对我来说,设备宽度与触控设备无关, 我们在这里使用的触摸屏是桌面尺寸的显示器。

  • 我不想强制用户在多输入设备上通过触摸进行输入 设备。

最佳答案

我已经按照上面评论中链接中分享的方法解决了这个问题。如果您不使用它,请考虑使用 Modernizr在这种情况下。也想听听其他一些方法...

作为用户,Blender提及,您可以像这样检查触摸事件:

html.touch {
  /* Touch Device ~ No Hovers */
}

html.no-touch {
  /* Not a Touch is disabled */
}
html.no-touch .element:hover {
   opacity:.5;
}

关于javascript - 不要在触摸设备上显示悬停状态,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17407155/

相关文章:

javascript - 我怎样才能捕捉到链接的打开情况

javascript - 如何在两个浏览器窗口之间进行通信?

html - 使用 bootstrap css 的响应式表单

html - 子菜单现在拉伸(stretch) 100% 但填充太多?我正在猜测

html - Firefox 不喜欢 margin auto with flex box model

css - 使用 Bootstrap 3 样式/布局用户摘要框

javascript - 将数组转换为字符串时允许逗号跟随

Javascript 库性能

php - 在 slider 显示中显示多个图像

html - 使用 ID 选择器的样式元素问题