Device.js makes it easy for you to write conditional CSS and JavaScript based on device operating system (iOS, Android, Blackberry), orientation (Portrait vs. Landscape), and type (Tablet vs. Mobile).
Device.js inserts CSS classes into the <html> element.
Just include the script. The script then updates the <html> section with the appropriate classes based on the device's characteristics.
<script src="device.js"></script>The following tables map which CSS classes are added based on device and orientation.
| 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 |
| Desktop | desktop |
| Orientation | CSS Classes |
|---|---|
| Landscape | landscape |
| Portrait | portrait |
Device.js also includes support for conditional JavaScript, allowing you to write checks on the following device characteristics:
| 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() |
| Orientation | JavaScript Method |
|---|---|
| Landscape | device.landscape() |
| Portrait | device.portrait() |
- iOS: iPhone, iPod, iPad
- Android: Phones & Tablets
- Blackberry: Phones & Tablets
- Windows: Phones & Tablets
All comments in how to improve this library are very welcome. Feel free post suggestions to the Issue tracker, or even better, fork the repository to implement your own ideas and submit a pull request.
Unless attributed otherwise, everything is under the MIT License (see LICENSE for more info).
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent