Device.js——检测设备平台、操作系统的Javascript 库

Device.js 是一个可以让你检测设备的平台,操作系统和方向 JavaScript 库,它会自动在 <html> 标签添加一些设备平台,操作系统,方向相关的 CSS class,这样就能让你针对不同设备撰写不同的 CSS,并且还提供一些 Javascript 函数来判断设备。

《Device.js——检测设备平台、操作系统的Javascript 库》

Device.js 通过操作系统(比如 iOS,安卓,黑莓,Windows,Firefox OX),方向(横屏或者竖屏),类型(平板或者移动设备),如下面在 iPhone 上的浏览的时候在 <html> 添加的 CSS Class:

《Device.js——检测设备平台、操作系统的Javascript 库》

支持的设备

  • 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:

DeviceCSS Classes
iPadios ipad tablet
iPhoneios iphone mobile
iPodios ipod mobile
Android Phoneandroid mobile
Android Tabletandroid tablet
BlackBerry Phoneblackberry mobile
BlackBerry Tabletblackberry tablet
Windows Phonewindows mobile
Windows Tabletwindows tablet
Firefox OS Phonefxos mobile
Firefox OS Tabletfxos tablet
Desktopdesktop
OrientationCSS Classes
Landscapelandscape
Portraitportrait

相关的 Javascript 函数

DeviceJavaScript Method
Mobiledevice.mobile()
Tabletdevice.tablet()
iOSdevice.ios()
iPaddevice.ipad()
iPhonedevice.iphone()
iPoddevice.ipod()
Androiddevice.android()
Android Phonedevice.androidPhone()
Android Tabletdevice.androidTablet()
BlackBerrydevice.blackberry()
BlackBerry Phonedevice.blackberryPhone()
BlackBerry Tabletdevice.blackberryTablet()
Windowsdevice.windows()
Windows Phonedevice.windowsPhone()
Windows Tabletdevice.windowsTablet()
Firefox OSdevice.fxos()
Firefox OS Phonedevice.fxosPhone()
Firefox OS Tabletdevice.fxosTablet()
OrientationJavaScript Method
Landscapedevice.landscape()
Portraitdevice.portrait()

项目主页:Device.js

via wpjam

    原文作者:weakish
    原文地址: https://segmentfault.com/a/1190000000373735
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞