Jquery width and height of body

Question

I have the following jquery code to check for the window dimensions. Unfortunately it seems to only pick up the width - the height is returning as zero. Where am I going wrong?

$(document).ready(function() {
    var $window = $('body');
    function checkSize() {
        var windowWidth = $window.width();
        var windowHeight = $window.height();

        if (windowWidth < 765) {
            $('#index_right').hide();
            $('.btn').removeClass("btn-large");
        }
        else if (windowWidth < 880) {
            $('#index_right').hide();

            $('.btn').addClass("btn-large");
        }
        else
        {
            $('#index_right').fadeIn(1000);
            $('.btn').addClass("btn-large");
        }

        if (windowHeight < 3000) {
            //alert(windowHeight);
            $('#index_base').hide();
        }
        else
        {
            $('#index_base').fadeIn(1000);
        }
    }
    checkSize();
    $(window).resize(checkSize);
});

Amy, check out the examples that jQuery gives here with height: http://api.jquery.com/height/ `$(window).height(); // returns height of browser viewport` — Matthew Blancarte, Jun 19 '13 at 15:59

score 1 · Answer 1 · answered Jun 19 '13 at 15:56

1

It seems that you're trying to show and hide different content depending on the screen-size of visitor, why not use media queries instead?

(More info http://www.w3.org/TR/css3-mediaqueries/)

answered Jun 19 '13 at 15:56

Muhan Alim

479
1
7
17

This might help, http://stackoverflow.com/questions/838137/jquery-change-height-based-on-browser-size-resize, also see comment of Fahrenheit451 remove `var $window = $('body');` and just use `$(document).height() ` or `$(window).height()` and `$(window).width()` – Grmn Jun 19 '13 at 16:02

score 1 · Accepted Answer · answered Jun 19 '13 at 15:57

1

Try using jquery's built in height method instead:

$(window).height();

answered Jun 19 '13 at 15:57

Fahrenheit451

26
4

score 0 · Answer 3 · answered Jun 19 '13 at 16:03

0

var $window = $('body');

Should be

var $window = $('window');

answered Jun 19 '13 at 16:03

PhilTrep

1,521
1
10
23

Jquery width and height of body

3 Answers3