Media Query test without scrollbar

Test media query with scrollbar.

by web tiki

HTML

<div id="wind">window width : <span>resize the window width!</span></div>

CSS

@media screen and (max-width: 800px) {
    body {background: lightgrey ;}
}

@media screen and (max-width: 700px) {
    body {background: aqua ;}
}

@media screen and (max-width: 600px) {
    body {background: grey ;}
}

JavaScript

$(window).on('resize', function(){
    var wind     = $( window ).width();
    $('#wind span').html(wind + "px");
   
});