views:

253

answers:

3

Greetings and Hello
I am trying to put together a wordpress site, now because the content in the main div is going to be a different height with every page I need the navigation sidebar to stretch to the same height.
So with a little javascript tom-foolery I can get the sidebar to be the same height with the following code

function adjust(){
    hgt=document.getElementById('content').offsetHeight;
    document.getElementById('sidebar').style.height=hgt+'px';

}
window.onload=adjust;
window.onresize=adjust;  

Now that's all good for a long page but if the content is smaller then the sidebar stuff gets all messy. So I have tried an if statement like so

function adjust()
{
if (document.getElementById('content').style.height <  document.getElementById('sidebar').style.height){
hgt=document.getElementById('content').offsetHeight;
document.getElementById('sidebar').style.height=hgt+'px';
else
hgt=document.getElementById('sidebar').offsetHeight;
document.getElementById('content').style.height=hgt+'px';
}
}
window.onload=adjust;
window.onresize=adjust;  

But that just doesn't do anything, so any ideas whats going on?

A: 

could be several reasons:

1) as Waleed says you are missing a closure.

2) If you did not set an explicit style for

document.getElementById('sidebar').style.height

it will return ""

3) Be careful assuming style.height and offsetHeight are equivalent. Depending on browsers, one or the other may be accounting for margins and paddingC:

plodder
A: 

Thanks guys ya I was just missing some closure brackets it works now
You Guys Rock

theZod
+1  A: 

the new code if anyone needs it

function adjust()
{
    if (document.getElementById('content').offsetHeight < document.getElementById('sidebar').offsetHeight)
        {
        hgt1=document.getElementById('sidebar').offsetHeight;
        document.getElementById('content').style.height=hgt1+'px';
        }
        else
        {
        hgt2=document.getElementById('content').offsetHeight;
        document.getElementById('sidebar').style.height=hgt2+'px';
        }

}
window.onload=adjust;
window.onresize=adjust;
theZod