检测设备是否启用触摸并且低于某个屏幕尺寸

-3

我想激活/禁用：根据设备悬停：我想最好的方法是检查设备是否启用触摸并检测屏幕尺寸，因为最新的笔记本电脑也有触摸屏。有没有办法做到这一点与JavaScript/jQuery的？检测设备是否启用触摸并且低于某个屏幕尺寸

2014-06-05 user1937021

有已经相当SO上提供一些这些问题的答案... –

您可以尝试

var is_touch_device = 'ontouchstart' in document.documentElement;

另一种方法来检测如下：

function is_touch_device() { 
    return !!('ontouchstart' in window); 
}

来源

2014-06-05 11:07:32

如果这是一个选项，Modernizr的就能检测触摸（除了一堆其他性能的目标浏览器/设备）：http://modernizr.com/它会在html标签上放置一个合适的类，它可以检测到。

为了检测屏幕尺寸（哦，浏览器窗口大小），您可以使用此：

window.screen.availHeight 
window.screen.availWidth

来源

2014-06-05 11:10:19

更多仅供参考，但Modernizr的不检测触摸设备，只需触摸事件：https://github.com/Modernizr/Modernizr/问题/ 548 – mikedidthis

var touchDevice = (typeof (window.ontouchstart) !== 'undefined') ? true : false;

来源

2014-06-05 11:20:42

您可以结合modernizr和媒体查询：

在Modernizr的下载页面你用TOUCH EVENT创建文件选中。 Modernizr的将包括touch或no-touch类您<body>

在你的CSS的.no-touch之前每个:hover插入。在下一个示例中，只有宽度高于768像素且没有触摸事件的屏幕才会有:hover。

/* CSS */ 
a{ 
    color:#DD0000; /* Dark red */ 
    text-decoration:none; 
} 
@media screen and (min-width: 768px) { 
    .no-touch a:hover { 
     color:#FF0000; /* red */ 
     text-decoration:underline; 
    } 
}

来源

2014-06-05 11:23:36

检测设备是否启用触摸并且低于某个屏幕尺寸

回答

相关问题