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.