我的网站上有一些 jquery 鼠标悬停效果，我需要禁用触摸屏，但是，我如何知道禁用 JQuery 的屏幕宽度？目前我的分辨率低于 800 像素。这适用于 ipad 肖像，但是当我把它变成风景时，JQuery 再次被激活。我读过 Ipad 横向宽度为 1024 像素，但这也可能是小型非触摸屏的大小。有没有办法为某些设备指定效果而不是屏幕宽度？
【问题讨论】：
标签： responsive-design screen-orientation
要实现这一点，您应该考虑另一种工作方式，而不是禁用触摸设备的鼠标悬停事件添加非触摸设备的事件。
将Modernizr 添加到您正在处理的项目中（您可能已经在其中找到了它）。添加后，您可以通过将其作为类添加到 HTML 元素来包含“触摸”测试
<html class="touch">
如果设备具有触摸功能，那么一切都会保持原样，但是如果设备没有触摸功能，则 moderizr 会将其从 touch 转换为 no-touch
<html class="no-touch">
然后，您可以将鼠标事件绑定到具有 .no-touch 类的 html 元素上
我在代码笔中放了一个例子 - http://rwd.is/VyRl37
这假设您仍在为所有设备加载 jQuery 库并决定是否加载基于触摸设备的鼠标悬停功能。如果您正在考虑有条件地加载 jQuery 本身，那么您应该查看 enquire.js 以指定宽度加载 jQuery。
如果您想在较小的设备上保留 jQuery 的其他功能，但又想提高性能，您可以考虑使用 Zepto.js 作为轻量级替代方案。
最后Response.js 还允许您在特定断点处调用函数，但您仍然会遇到不知道它是否启用触摸的问题。
【讨论】：