matchMedia polyfill for testing media queries in JS
Branch: master
Clone or download
paulirish readme: add require() hint
and move some stuff.
Latest commit cd9df4c Jun 14, 2018


matchMedia() polyfill

test whether a CSS media type or media query applies


// Likely want to requier both polyfills..

test 'tv' media type

if (matchMedia('tv').matches) {
  // tv media type supported

test a mobile device media query

if (matchMedia('only screen and (max-width: 480px)').matches) {
  // smartphone/iphone... maybe run some small-screen related dom scripting?

test landscape orientation

if (matchMedia('all and (orientation:landscape)').matches) {
  // probably tablet in widescreen view

Used in:

How about resizing the browser?

Paul Hayes tackled this using CSS transitions and their transitionEnd event

His code: -- though currently it doesnt support IE6-9, since they dont have transitions, obviously. :)