javascript - 用于检测仅触摸设备的 jQuery 解决方案？

Question

我在我的网站上设计了一个图片库，在鼠标滑过它们之前不会显示下一个/上一个箭头 .next:hover{display: block} 这很好，但是网站是流畅的，我根本不认为悬停(鼠标悬停)在触摸屏上不起作用!我不想让箭头一直显示，除非设备是触摸屏，例如 ipad!

检测设备是否仅触摸的最佳方法是什么，如果是，则更改显示:无以自动显示 block 。有没有一种 jQuery 方法可以做到这一点？

我希望这是有道理的，我用谷歌搜索并搜索了 S.O.但无法找到直接答案。再加上我在 jQuery 方面有点(轻描淡写)新手!

谢谢你的帮助

Answer 1

我做了这样的事情，当我测试它时，点击计数器也会触发触摸事件。

// Detect touchscreen only
var touchscreenonly = true;
var moves = 0;
var clicks = 0;
$("body").mousemove(function() { 
    moves++;
    if (moves > clicks + 1){
        touchscreenonly = false;
        // now unbind these functions if you like
        $(this).unbind("mousemove").unbind("click");
        console.log('mouse moved, this is not a touch-only device');
    }
}).click(function(){ 
    clicks++;
});