1

我的最终愿望是允许使用触摸屏桌面（没有鼠标或键盘的一体机）的用户在使用工具提示的网站上导航。使用鼠标，将鼠标悬停在工具提示上会打开它，工具提示包含可以单击的链接。使用触摸屏，没有悬停，只有“触摸”/点击。在这两种情况下，页面都将使用相同的浏览器显示在相同的操作系统上，一旦用户使用鼠标，另一次用户使用触摸屏。

所以我需要区分这两者：带鼠标的台式电脑和不带鼠标的触摸屏台式电脑。Modernizr 触摸测试 (http://modernizr.github.com/Modernizr/touch.html) 在触摸屏桌面 (http://shop.lenovo.com/us/landing_pages/thinkcentre/2010/m90z) 上完全失败。嗅探 UA 或浏览器也不起作用。

（经过大量搜索，所有检测都试图区分不同版本的手机或平板电脑、浏览器、UA……而不是使用相同浏览器在相同操作系统上运行的桌面触摸屏。）

有任何想法吗？

4

1 回答 1

1

将事件侦听touchstart器添加mousemove到您的页面，然后等待用户开始与您的页面进行交互。如果第一个事件是mousemove，那么用户使用鼠标进行操作，所以它可能是一个桌面，否则这是一个触摸屏。

$(document).on('touchstart.desktopDetect mousemove.desktopDetect', function(ev) {
    window.IS_TOUCHSCREEN_DEVICE = (ev.type == 'touchstart');
    $(document).off('.desktopDetect');
});

在此处检查工作示例： https ://jsfiddle.net/evpozdniakov/uvb51cnm/embedded/result/

于 2015-12-22T15:55:06.670 回答