{"_id":"match-media","_rev":"4-3c52c4d423b4bb52006b3d3f524911ae","name":"match-media","description":"matchMedia polyfill for testing media queries in JS","dist-tags":{"latest":"0.2.0"},"versions":{"0.2.0":{"author":{"name":"Scott Jehl"},"name":"match-media","description":"matchMedia polyfill for testing media queries in JS","version":"0.2.0","homepage":"http://github.com/paulirish/matchMedia.js","repository":{"type":"git","url":"git://github.com/paulirish/matchMedia.js.git"},"main":"./matchMedia.js","gitHead":"25068e76e38d5fbc92b7d2f3b715043d928d8193","bugs":{"url":"https://github.com/paulirish/matchMedia.js/issues"},"_id":"match-media@0.2.0","scripts":{},"_shasum":"ea4e09742e7253cc7d7e1599ba627e0fa29fbc50","_from":".","_npmVersion":"2.12.1","_nodeVersion":"0.12.7","_npmUser":{"name":"nkt","email":"gusnkt@gmail.com"},"dist":{"shasum":"ea4e09742e7253cc7d7e1599ba627e0fa29fbc50","tarball":"https://registry.npmjs.org/match-media/-/match-media-0.2.0.tgz","integrity":"sha512-EoLj8yVf95UNcZMbNJBlAA3E6XLzgMI6ZbnL90WnL2YCzOO4Nza1Ol6TH9ElbuUcDWxN7KxgVM2vYI6P5JqvKg==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFGLQhg82Lv8H3wRDe957LwBgAvJ8fOxgAwcbvhAbNGjAiEAyDasmeKX0S0MA/nxLqhnetjmyXg/hKpmMHhxz6KDcik="}]},"maintainers":[{"name":"nkt","email":"gusnkt@gmail.com"}]}},"readme":"#matchMedia() polyfill\n\n## test whether a CSS media type or media query applies\n\n* **Authors**: Scott Jehl, Paul Irish, Nicholas Zakas \n* **Spec**: [dev.w3.org/csswg/cssom-view/#dom-window-matchmedia](http://dev.w3.org/csswg/cssom-view/#dom-window-matchmedia)\n* **Native support**: Chrome [since m10](http://trac.webkit.org/changeset/72552), Firefox [since 6](https://developer.mozilla.org/en/Firefox_6_for_developers), and Safari [since 5.1](https://developer.mozilla.org/en/DOM/window.matchMedia#Browser_compatibility)\n\n### How about resizing the browser?\nPaul Hayes [tackled this using CSS transitions and their transitionEnd event](http://www.paulrhayes.com/2011-11/use-css-transitions-to-link-media-queries-and-javascript/) \n\nHis code: https://github.com/fofr/matchMedia.js -- though currently it doesnt support IE6-9, since they dont have transitions, obviously. :)\n\n\n## Usage\n\n#### test 'tv' media type\n    if (matchMedia('tv').matches) {\n      // tv media type supported\n    }\n\n### test a mobile device media query\n    if (matchMedia('only screen and (max-width: 480px)').matches) {\n      // smartphone/iphone... maybe run some small-screen related dom scripting?\n    }\n    \n#### test landscape orientation\n    if (matchMedia('all and (orientation:landscape)').matches) {\n      // probably tablet in widescreen view\n    }\n\n\n## Used in: \n\n* [Respond.js](https://github.com/scottjehl/Respond)\n* [FormFactor](https://github.com/PaulKinlan/formfactor)\n* [Modernizr](http://www.modernizr.com/)\n","maintainers":[{"name":"nkt","email":"gusnkt@gmail.com"}],"time":{"modified":"2022-06-19T16:29:31.916Z","created":"2015-07-17T18:40:13.948Z","0.2.0":"2015-07-17T18:40:13.948Z"},"homepage":"http://github.com/paulirish/matchMedia.js","repository":{"type":"git","url":"git://github.com/paulirish/matchMedia.js.git"},"author":{"name":"Scott Jehl"},"bugs":{"url":"https://github.com/paulirish/matchMedia.js/issues"},"readmeFilename":"README.md","users":{"isenricho":true}}