Test css media queries in javascript. A faster polyfill for matchMedia support.
npm install media-matchMedia.match
===========
Test css media queries in javascript. A faster polyfill for matchMedia support. Follow the project on Twitter @mediamatchjs.
Why?
---
* Browser support: Tested in IE 6-9, Chrome, Firefox, Opera, Safari, iOS and Android
* Feature support: Has all the basics + most of the spec http://www.w3.org/TR/css3-mediaqueries/
* Speed: In many browsers, ops/sec rival or exceed native matchMedia. See 'test' to run your own speed tests using JSLitmus or check out http://jsperf.com/matchmedia/11 and http://jsfiddle.net/wV9HZ/2/
* Size: 2.73KB minified (1.46KB gzipped)
Media type and feature support
---
* type: all, screen, print, speech, projection, handheld, tv, braille, embossed, tty
* width: width, min-width, max-width
* height: height, min-height, max-height
* device-width: device-width, min-device-width, max-device-width
* device-height: device-height, min-device-height, max-device-height
* aspect-ratio: aspect-ratio, min-aspect-ratio, max-aspect-ratio
* device-aspect-ratio: device-aspect-ratio, min-device-aspect-ratio, max-device-aspect-ratio
* orientation: orientation
* resolution: resolution, min-resolution, max-resolution
* device-pixel-ratio: device-pixel-ratio, min-device-pixel-ratio, max-device-pixel-ratio
* color: color, min-color, max-color
* color-index: color-index, min-color-index, max-color-index
###Lacks support
* monochrome: monochrome, min-monochrome, max-monochrome
* scan: scan
* grid: grid
Requirements
---
####media.match.min.js/media.match.js
* Provides core functionality. Does not contain external javascript library or css dependencies.
* Version 1 of this project contained a css dependency that is now solely handled by media.match.js. See branch, "version1" for previous iteration.
Example
---
Both code blocks are valid uses of ``matchMedia()`. The first example shows the caching of a `MediaQueryList` object and the second shows an alternative usage as well as `addListener` support.`
The addListener` method is part of the `MediaQueryList` object, therefore it can be added on the cached version or immediately after `matchMedia()`.
`````
##Related projects
* Nonresponsive: Media queries for the unsupportive IE6-8.
* Picture: Responsive images based on the 'picture' element proposal.
* Img-srcset: Responsive images based on the 'srcset' attribute proposal.