Skip to content

Commit

Permalink
readme: add require() hint
Browse files Browse the repository at this point in the history
and move some stuff.
  • Loading branch information
paulirish committed Jun 13, 2018
1 parent b9f5997 commit cd9df4c
Showing 1 changed file with 19 additions and 10 deletions.
29 changes: 19 additions & 10 deletions README.md
Expand Up @@ -4,18 +4,14 @@

## test whether a CSS media type or media query applies

* **Authors**: Scott Jehl, Paul Irish, Nicholas Zakas
* **Spec**: [dev.w3.org/csswg/cssom-view/#dom-window-matchmedia](http://dev.w3.org/csswg/cssom-view/#dom-window-matchmedia)
* **Native support**: Chrome [since m10](http://trac.webkit.org/changeset/72552), Firefox [since 6](https://developer.mozilla.org/en/Firefox/Releases/6), and Safari [since 5.1](https://developer.mozilla.org/en/DOM/window.matchMedia#Browser_compatibility)

### How about resizing the browser?
Paul 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/)

His code: https://github.com/fofr/matchMedia.js -- though currently it doesnt support IE6-9, since they dont have transitions, obviously. :)


## Usage

```js
// Likely want to requier both polyfills..
require('matchmedia-polyfill');
require('matchmedia-polyfill/matchMedia.addListener');
```

#### test 'tv' media type
```js
if (matchMedia('tv').matches) {
Expand All @@ -37,8 +33,21 @@ if (matchMedia('all and (orientation:landscape)').matches) {
}
```


## Used in:

* [Respond.js](https://github.com/scottjehl/Respond)
* [FormFactor](https://github.com/PaulKinlan/formfactor)
* [Modernizr](http://www.modernizr.com/)


### How about resizing the browser?
Paul 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/)

His code: https://github.com/fofr/matchMedia.js -- though currently it doesnt support IE6-9, since they dont have transitions, obviously. :)

----------

* **Authors**: Scott Jehl, Paul Irish, Nicholas Zakas
* **Spec**: [dev.w3.org/csswg/cssom-view/#dom-window-matchmedia](http://dev.w3.org/csswg/cssom-view/#dom-window-matchmedia)
* **Native support**: Chrome [since m10](http://trac.webkit.org/changeset/72552), Firefox [since 6](https://developer.mozilla.org/en/Firefox/Releases/6), and Safari [since 5.1](https://developer.mozilla.org/en/DOM/window.matchMedia#Browser_compatibility)

0 comments on commit cd9df4c

Please sign in to comment.