0

我正在尝试隐藏平板电脑和智能手机的 div，但仍想在Microsoft Surface Pro等混合设备上显示它。

Foundation 4 提供了触摸检测类，但我不确定它是否会在混合设备上隐藏或显示。

有没有人有这方面的经验？我将如何控制它？

/* The touch detection classes */
.show-for-touch       /* Visible for touch enabled devices */
.hide-for-touch       /* Hidden for touch enabled devices */
4

1 回答 1

1

Foundation 4 使用 Modernizr 来检测浏览器中对触摸事件 API 的支持，而不是触摸设备。我认为你最好的“解决”问题是嗅探用户代理，看看它是否与相关的匹配 Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; Trident/6.0; Touch)，取自User-agent string。为了使其成为未来的证明，也许只需查看用户代理字符串是否以 . 结尾Touch并包含Windows. 如果您检测到这样的用户代理，则让 Modernizr 执行替代代码（您决定什么）。

我看到当前的 Foundation 4 版本使用自定义的 Modernizr 构建，即Build: http://modernizr.com/download/#-inlinesvg-svg-svgclippaths-touch-shiv-mq-cssclasses-teststyles-prefixes-ie8compat-load.

为了为 Modernizr 编写自定义测试，您需要Modernizr.addTest，Foundation 4 包含的默认构建中缺少它。您需要进行自定义构建，我已经为您准备好了，它还应该包含所有其他“功能”当前 Foundation Modernizr 自定义构建包含带有 addtest 的自定义 Modernizr 构建

这是用于自定义用户代理测试的示例 Modernizr 测试的外观。

Modernizr.addTest('winsurface', function () {
 return !!navigator.userAgent.match(/put your regex here/g);
});

然后，如果您想在测试结果呈阳性的情况下做某事，您可以：

if (Modernizr.winsurface) {
...put your js code here
}
于 2013-07-16T19:55:57.113 回答