1.0.0 • Published 9 years ago

media-query-matcher v1.0.0

Weekly downloads
2
License
MIT
Repository
github
Last release
9 years ago

Use the native matchMedia API to detect if a specific media query applies on the page.

Browser Support

  • IE 10+
  • Firefox
  • Chrome
  • Safari

Installation

npm install media-query-matcher --save

Example

var MediaQueryMatcher = require('media-query-matcher');

var mqMatcher = new MediaQueryMatcher({
	'phone': 'only screen and (min-width: 480px)',
	'tablet': 'only screen and (min-width: 768px)'
});

console.log('phone: ', mqMatcher.is('phone') );
console.log('tablet: ', mqMatcher.is('tablet') );

mqMatcher.on('phone', function() {
	console.log('on phone: true');
});

mqMatcher.on('tablet', function() {
	console.log('on tablet: true');
});

A more comprehensive example is available by running:

npm run demo