8

I'm trying to figure out what the best way to get enquire.js to work on legacy browsers (ie 6-9). On enquire's site, it says to use modernizr to check for matchMedia support, then load a polyfill if it's not supported. 

Modernizr.load([
    //first test need for polyfill
    {
        test: window.matchMedia,
        nope: "/path/to/polyfill.js"
    },

    //and then load enquire
    "/path/to/enquire.js"
]);

Looking at the polyfill that it suggests, it says that modernizr already includes it with Modernizr.mq(). 

    Used in:
    Respond.js
    FormFactor
    Modernizr
https://github.com/paulirish/matchMedia.js/

I've looked into this, but can't find a way to make this work.

Dan
  • 363
  • 1
  • 5
  • 15

1 Answers1

20

enquire author here!

So there's always a little confusion about the matchMedia polyfill. It doesn't polyfill CSS3 media query support into legacy browsers. What it does is polyfill the matchMedia javascript API for those browsers that support CSS3 media queries but do not offer this API. See here for support for matchMedia. For instance, IE9 supports CSS3 media queries, but doesn't have the matchMedia JS API, this is the target of Paul Irish's matchMedia polyfill.

If you're looking for a fully featured polyfill, that gives decent media query suport to older browsers, can I suggest using David Knight's media-match? I have worked in conjunction with him to test this and have proven support all the way back to IE6 - it works a charm :) You can find that here: https://github.com/weblinc/media-match. You can conditionally load it exactly as I suggested with Modernizr, just replace the appropriate parts.

Hope that helps, happy to answer any further questions you have.

WickyNilliams
  • 5,218
  • 2
  • 31
  • 43
  • Thanks for the explanation. I ended up just using Paul Irish's instead. I'm not providing a polyfill for responsive styles anyway, so I don't need to conditionally load JavaScript based on media queries. I just needed to think it through a little more. Thanks again for the help! – Dan Jan 22 '13 at 17:27
  • @WickyNilliams this fixed my issues in IE, please add this into your documentation very useful. why can't other authors be half as helpful as you thanks – John Magnolia Apr 03 '13 at 12:59
  • I've been working on updating the docs for a while now. It will have examples, better explanations and a scenario-based walk through of all the features :) Keep your eyes peeled, it's almost done – WickyNilliams Apr 05 '13 at 08:43