Question

I’m trying to use the following code to improve a couple of layout elements on an adaptive design. It doesn’t seem to work though, it calls the first property, but that’s it. Here it is in testing state using color.

$(document).ready(function() {
    if ((screen.width>940)) {
        // if screen size is 940px wide or larger
        $("body").css('color', '#222'); // you can also use $(".yourClass").hide();
    } else {
        // if screen size width is less than 940px
        $("body").css('color', 'red'); // here you can also use show();
    }
});

Any help is sincerely appreciated!

Answer 1

do you by any chance mean $(window).width()? screen.width for me is always 1920 on my computer. On a smart phone it should be smaller, but on any given device it should be pretty constant. In any case using $(window).width() proves your syntax is correct.

http://jsfiddle.net/VvFkK/