mobile-detect.js

A loose port of Mobile-Detect to JavaScript.

This script will detect the device by comparing patterns against a given User-Agent string. You can find out information about the device rendering your web page:

mobile or not
if mobile, whether phone or tablet
operating system
Mobile Grade (A, B, C)
specific versions (e.g. WebKit)

Current master branch is using detection logic from Mobile-Detect@2.8.11

Live Demo

@zeno created a very nice live-demo. See it in action with your device:

Demo

Usage

Browser

<script src="mobile-detect.js"></script>
<script>
    var md = new MobileDetect(window.navigator.userAgent);
    // ... see below
</script>

Node.js / Express

var MobileDetect = require('mobile-detect'),
    md = new MobileDetect(req.headers['user-agent']);
// ... see below

General

var md = new MobileDetect(
    'Mozilla/5.0 (Linux; U; Android 4.0.3; en-in; SonyEricssonMT11i' +
    ' Build/4.1.A.0.562) AppleWebKit/534.30 (KHTML, like Gecko)' +
    ' Version/4.0 Mobile Safari/534.30');

// more typically we would instantiate with 'window.navigator.userAgent'
// as user-agent; this string literal is only for better understanding

console.log( md.mobile() );          // 'Sony'
console.log( md.phone() );           // 'Sony'
console.log( md.tablet() );          // null
console.log( md.userAgent() );       // 'Safari'
console.log( md.os() );              // 'AndroidOS'
console.log( md.is('iPhone') );      // false
console.log( md.is('bot') );         // false
console.log( md.version('Webkit') );         // 534.3
console.log( md.versionStr('Build') );       // '4.1.A.0.562'
console.log( md.match('playstation|xbox') ); // false

More Info ...

There is some documentation generated by JSDoc:

http://hgoebl.github.io/mobile-detect.js/doc/MobileDetect.html

Side Effects

Script creates the global property MobileDetect.

Modernizr Extension

When using Modernizr, you can include mobile-detect-modernizr.js. It will add the CSS classes mobile, phone, tablet and mobilegradea if applicable.

You can easily extend it, e.g. android, iphone, etc.

Size (bytes)

development: 59382
minified: 33281
minified + gzipped: 13939 (cat mobile-detect.min.js | gzip -9f | wc -c)

Installation

Bower

$ bower install hgoebl/mobile-detect.js --save

Node.js / npm

$ npm install mobile-detect --save

CDN - jsDelivr

<script src="//cdn.jsdelivr.net/mobile-detect.js/0.4.3/mobile-detect.min.js"></script>

cdnjs - cdnjs.com

<script src="//cdnjs.cloudflare.com/ajax/libs/mobile-detect/0.4.3/mobile-detect.min.js"></script>

Alternatives / Infos

Often device detection is the first solution in your mind. Please consider looking for other solutions like media queries and feature detection (e.g. w/ Modernizr). Maybe there are better (simpler, smaller, faster) device detection libraries, so here you have a list (order has no meaning apart from first element):

Mobile-Usage Statistics

If you have to provide statistics about how many and which mobile devices are hitting your web-site, you can generate statistics (data and views) with hgoebl/mobile-usage. There are many hooks to customize statistical calculation to your needs.

License

MIT-License (see LICENSE file).

Contributing

Your contribution is welcome. If you want new devices to be supported, please contribute to Mobile-Detect instead.

To run generate-script it is necessary to have Mobile-Detect as a sibling directory to mobile-detect.js/. (I tried to use git subtree but had some problems on Mac OS X - probably my fault...)

fork or clone serbanghita/Mobile-Detect
fork hgoebl/mobile-detect.js
run npm install
create branch
make changes and run grunt (needs PHP >= 5.4 in your path)
run browser test (tests/SpecRunner.html)
commit, push to your branch
create pull request

Testing

Browser

Open tests/SpecRunner.html in different browsers.

Node.js

$ npm test
$ # or
$ grunt jasmine_node

Donations

If you want, you can donate to Mobile-Detect.

TODO

Extend RegEx patterns so that test passes

License

denich/mobile-detect.js

ErrorLooks like something went wrong!

About

Resources

License

Stars

Watchers

Forks

Releases

Packages 0

Languages

Error
Looks like something went wrong!

Packages