2011-07-06 81 views
3

好的,我一直在研究這一段時間,似乎有幾種方法可以做到這一點,CSS媒體查詢,檢測屏幕大小,htaccess和JavaScript。檢測平板電腦和手機,htaccess或CSS

我寧願去htaccess路由,因爲據我所知,平板電腦現在有1024px的分辨率。這不會干擾桌面解決方案嗎?此外,htaccess讓我有機會爲平板電腦和移動瀏覽器構建一個全新的網站,但我該如何去檢測它是平板電腦還是手機?我不想檢測它是谷歌Nexus還是HTC Desire或者iPhone,對比iPad,Acer Iconia,Xoom等。

有沒有辦法檢測平板電腦,手機或臺式電腦,而不必包括每一個品牌和型號? (for example as here。)

回答

6

我建議使用Modernizr這個。

它使用JavaScript客戶端瀏覽器上,以檢測全範圍的瀏覽器功能,包括觸摸事件的支持,併爲您提供CSS類,哪些是你可以用它來調整你的網站,以適應用戶的瀏覽器Javascript對象。

我總是會避免在服務器上進行瀏覽器檢測(即在.htaccess或服務器端代碼中),因爲它不可靠 - 服務器可以用來檢測客戶端環境的數據以純文本形式發送並很容易被欺騙或黑客入侵。更重要的是,它通常也被代理和隱私應用所壓制。

+0

這是一個很好的資源,但我肯定在尋找一種方式來創建桌面兩種不同的HTML結構和手機/平板電腦版本.. – Kyle

2

如果要使用.htaccess檢測移動瀏覽器,則必須列出其名稱(至少是最獨特的部分)。它可以用一個重寫規則來完成,例如(從SO另一個問題採取):

RewriteCond %{HTTP_USER_AGENT} "android|blackberry|ipad|iphone|ipod|iemobile|opera mobile|palmos|webos|googlebot-mobile" [NC] 
RewriteCond %{REQUEST_URI} !^/mobile.php 
RewriteRule .* /mobile.php?url=%{REQUEST_URI} [L]