Device.js - 檢測設備平臺、操作系統的Javascript 庫

jopen 8年前發布 | 10K 次閱讀 移動Web開發框架 移動開發

Device.js 是一個可以讓你檢測設備的平臺,操作系統和方向 JavaScript 庫,它會自動在 <html> 標簽添加一些設備平臺,操作系統,方向相關的 CSS class,這樣就能讓你針對不同設備撰寫不同的 CSS,并且還提供一些 Javascript 函數來判斷設備。

Device.js 通過操作系統(比如 iOS,安卓,黑莓,Windows,Firefox OX),方向(橫屏或者豎屏),類型(平板或者移動設備),如下面在 iPhone 上的瀏覽的時候在 <html> 添加的 CSS Class:

支持的設備

  • iOS: iPhone, iPod, iPad
  • Android: Phones & Tablets
  • Blackberry: Phones & Tablets
  • Windows: Phones & Tablets
  • Firefox OS: Phones & Tablets

如何使用

Device.js 使用非常簡單,只需要在頁面的 head 載入相關的 JS 庫即可:

<script src="device.js"></script>

生成的 CSS Class:

Device CSS Classes
iPad ios ipad tablet
iPhone ios iphone mobile
iPod ios ipod mobile
Android Phone android mobile
Android Tablet android tablet
BlackBerry Phone blackberry mobile
BlackBerry Tablet blackberry tablet
Windows Phone windows mobile
Windows Tablet windows tablet
Firefox OS Phone fxos mobile
Firefox OS Tablet fxos tablet
Desktop desktop
Orientation CSS Classes
Landscape landscape
Portrait portrait

相關的 Javascript 函數

Device JavaScript Method
Mobile device.mobile()
Tablet device.tablet()
iOS device.ios()
iPad device.ipad()
iPhone device.iphone()
iPod device.ipod()
Android device.android()
Android Phone device.androidPhone()
Android Tablet device.androidTablet()
BlackBerry device.blackberry()
BlackBerry Phone device.blackberryPhone()
BlackBerry Tablet device.blackberryTablet()
Windows device.windows()
Windows Phone device.windowsPhone()
Windows Tablet device.windowsTablet()
Firefox OS device.fxos()
Firefox OS Phone device.fxosPhone()
Firefox OS Tablet device.fxosTablet()
Orientation JavaScript Method
Landscape device.landscape()
Portrait device.portrait()

項目主頁:Device.js


via wpjam

來自: http://segmentfault.com/a/1190000000373735

 本文由用戶 jopen 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!