Creating media queries using Modernizr and jQuery

Bruno Kos — Thu, 10 Mar 2016 16:40:38 +0000

Modernizr can do lots of things – one of them is the ability to mix media query function with jQuery functions. Although there are other ways to achieve this, even (or especially) within jQuery itself, if using Modernizr for some other things on your website, you can try something like the following:

$(document).ready(function() {
  if (Modernizr.mq("screen and (max-width:480px)")) {
    $("li").addClass("myClass");
  }
});

li {
  color: #FFF;
}

.myClass {
  color: #000;
}

and finally some HTML:


  CHANGE COLOR

If this piece of HTML is loaded on resolution below 480px, .myClass will be added.

Post Creating media queries using Modernizr and jQuery je prvi puta viđen na bbird.me.

Modernizr – bbird.me

Creating media queries using Modernizr and jQuery