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 | |
Landscape | landscape |
Portrait | portrait |
相关的 Javascript 函数
JavaScript Method | |
Mobile | device.mobile() |
Tablet | device.tablet() |
iOS | device.ios() |
device.ipad() | |
device.iphone() | |
device.ipod() | |
Android | device.android() |
device.androidPhone() | |
device.androidTablet() | |
BlackBerry | device.blackberry() |
device.blackberryPhone() | |
device.blackberryTablet() | |
Windows | device.windows() |
device.windowsPhone() | |
device.windowsTablet() | |
Firefox OS | device.fxos() |
device.fxosPhone() | |
device.fxosTablet() |
device.landscape() | |
device.portrait() |