Adding listener to matchMedia.js polyfill issue

Question

I am using https://github.com/paulirish/matchMedia.js/ along with the listener extension, however, I do not know how to write a listener for the match media query below. Any assistance would be much obliged.

JS:

if (matchMedia("(min-width: 52em)").matches) {
  $("details").attr("open", "open");
}

Answer 1

var handleMyMediaQuery = function(mql) {
        if (mql.matches) {
            // do match actions
        } else {
            // do unmatch actions
        }
    },
    myMediaQuery = window.matchMedia('(min-width: 52em)');

handleMyMediaQuery(myMediaQuery);
myMediaQuery.addListener(handleMyMediaQuery);

The first use of 'handleMyMediaQuery' checks immediately for a match to the media query and the second 'myMediaQuery.addListener(handleMyMediaQuery)' is triggered when the media query matches and then again when the media query does not match.

Hope that makes sense.