Search code examples
javascriptjqueryheightresolution

Recognize the body width and height

I need a little script which allows me to do this:

if(// window body Height is less then 660px) {
       // code to be executed if condition is true 
} 
else { 
      // code to be executed if condition is false 
}

Hope there is a simple solution for that!

EDIT:

I have this now:

$(document).ready(function(){  
                       
if(parseInt($('body').height())<660){
    $("#container").addClass("small");
}
else{
    $("#container").removeClass("small");
}
 });

But it's not working, anybody knows what I'm doing wrong?

Solution

  • Here you go:

    $( window ).resize(function () {
    $( container ).toggleClass( 'small', $( window ).height() < 660 );
}).triggerHandler( 'resize' );

    where container is a reference to your #container element.

    .triggerHandler() will manually fire the resize event (which in turn will execute the above resize handler), so the above code works both on re-size and on page load.