user188962
user188962

Reputation:

Javascript to set div height not working

im trying to set the height of two divs on my page, because my page content is dynamic. But it wont work. The height is just one screen of the divs.

The divs contain side borders, thats why it has to be all the way. Any ideas why the height only = one screen height?

function bodyHeight() {
    var scnHei;

    if (self.innerHeight) // all except Explorer
    {
        scnHei = self.innerHeight;
    }
    else if (document.documentElement && document.documentElement.clientHeight)
        // Explorer 6 Strict Mode
    {
        scnHei = document.documentElement.clientHeight;
    }
    else if (document.body) // other Explorers
    {
        scnHei = document.body.clientHeight;
    }

    document.getElementById("bgr_right").style.height=scnHei + "px";
    document.getElementById("bgr_left").style.height=scnHei + "px";
}

Here is where I call the function:

<body onload="bodyHeight();">

UPDATE: + added "px"; but DOESNT WORK EITHER...

Upvotes: 1

Views: 4676

Answers (3)

Eric Normand
Eric Normand

Reputation: 3836

Height and width properties require a unit (either "%" or "px"). Try this:

.style.height = scnHei + "px";

Upvotes: 1

BMBM
BMBM

Reputation: 16013

.style.height=scnHei;

should rather be

.style.height=scnHei + "px";

The same goes for .style.width of course. You forgot to add the unit to the width / height value.

Upvotes: 3

Chris Ballance
Chris Ballance

Reputation: 34347

This is only firing once, when the body is loaded. If you have an event that makes another call to BodyHeight(); then this should work.

Upvotes: 2

Related Questions