使用 Javascript 检测触摸屏设备 [英] Detecting touch screen devices with Javascript

问题描述

在 Javascript/jQuery 中，如何检测客户端设备是否有鼠标?

In Javascript/jQuery, how can I detect if the client device has a mouse?

我有一个网站，当用户将鼠标悬停在一个项目上时，它会向上滑动一个小信息面板.我正在使用 jQuery.hoverIntent 来检测悬停，但这显然不适用于 iPhone/iPad/Android 等触摸屏设备.因此，在这些设备上，我想恢复为点按以显示信息面板.

I've got a site that slides up a little info panel when the user hovers their mouse over an item. I'm using jQuery.hoverIntent to detect the hover, but this obviously doesn't work on touchscreen devices like iPhone/iPad/Android. So on those devices I'd like to revert to tap to show the info panel.

推荐答案

+1 用于 hover 和 click.另一种方法可能是使用 CSS 媒体查询并仅对较小的屏幕/移动设备使用某些样式，这些设备最有可能具有触摸/点击功能.因此，如果您通过 CSS 获得了一些特定的样式，并且您可以从 jQuery 检查这些元素的移动设备样式属性，那么您可以将它们挂钩以编写特定于移动设备的代码.

+1 for doing hover and click both. One other way could be using CSS media queries and using some styles only for smaller screens / mobile devices, which are the ones most likely to have touch / tap functionality. So if you have some specific styles via CSS, and from jQuery you check those elements for the mobile device style properties you could hook into them to write you mobile specific code.

请参阅此处:http://www.forabeautifulweb.com/blog/about/hardboiled_css3_media_queries/

这篇关于使用 Javascript 检测触摸屏设备的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！