爲超極本和筆記本電腦的混合

Question

我想Zurb基金會的知名度類隱藏平板電腦&智能手機一個div，但還是要顯示它在混合設備如微軟Surface Pro的。

基金會4提供touch detection classes，但我不知道這是否是要隱藏或顯示的混合設備。

有沒有人有這經驗？我將如何控制它？

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

Answer 1

Foundation 4使用Modernizr在瀏覽器中檢測對Touch Events API的支持，而不是觸摸設備。 我覺得這個問題你最好的「修復」是嗅探用戶代理，看它是否符合有關的一個 Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; Trident/6.0; Touch)，從User-agent string拍攝。 爲了使面向未來的，也許只是看到，如果用戶代理字符串中Touch結束，包含Windows。 如果您檢測到這樣的用戶代理，那麼讓Modernizr執行替代代碼（您決定做什麼）。

我看到當前基金第4版使用自定義Modernizr的建立，即Build: http://modernizr.com/download/#-inlinesvg-svg-svgclippaths-touch-shiv-mq-cssclasses-teststyles-prefixes-ie8compat-load。

爲了爲Modernizr編寫自定義測試，您需要Modernizr.addTest，這是Foundation 4包含的默認構建中缺少的。您需要進行自定義構建，我已經爲您準備好了，它還應該包含當前基金會Modernizr定製版本包含的所有其他「功能」Custom Modernizr Build with addtest

以下是您的自定義用戶代理測試的示例Modernizr測試的外觀。

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

然後，如果你想要做的事的情況下測試是肯定的，你會怎麼做：

if (Modernizr.winsurface) { 
...put your js code here 
}