相关疑难解决方法(0)

有没有一种可靠的方法来检测用户是否在jQuery中使用移动设备？类似于CSS @media属性的东西？如果浏览器在手持设备上,我想运行不同的脚本.

jQuery $.browser函数不是我想要的.

我编写了一个jQuery插件,可以在桌面和移动设备上使用.我想知道是否有一种方法可以检测设备是否具有触摸屏功能.我正在使用jquery-mobile.js来检测触摸屏事件,它可以在iOS,Android等上运行,但我也想根据用户的设备是否有触摸屏来编写条件语句.

那可能吗？

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

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

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

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

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

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

我已经尝试挂钩touchstart,touchmove和touchend事件,并呼吁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>

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

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

在像iPhone/iPad/Android这样的触摸设备上,用手指敲击一个小按钮很困难.没有跨浏览器方式来检测我所知道的CSS媒体查询的触摸设备.所以我检查浏览器是否支持javascript触摸事件.到目前为止,其他浏览器还没有支持它们,但是开发者频道上的最新Google Chrome 启用了触摸事件(即使是非触摸设备).而且我怀疑其他浏览器厂商会跟进,因为带触摸屏的笔记本电脑正在上市.更新:这是Chrome中的一个错误,所以现在JavaScript检测再次起作用.

这是我使用的测试:

function isTouchDevice() {
    return "ontouchstart" in window;
}

问题是,这只测试浏览器是否支持触摸事件,而不是设备.

有谁知道正确的[tm]方式为触控设备提供更好的用户体验？除了嗅探用户代理.

Mozilla有触摸设备的媒体查询.但我在其他任何浏览器中都没有看到类似的内容:https: //developer.mozilla.org/En/CSS/Media_queries#-moz-touch-enabled

更新:我想避免为移动/触摸设备使用单独的页面/网站.解决方案必须通过JavaScript检测具有对象检测功能的触摸设备,或者包含自定义触摸CSS而无需用户代理嗅探!我问的主要原因是,在我联系css3工作组之前,确保今天不可能.如果你不能按照问题的要求请不要回答;)