Dynamically resizing navigation div to main content

Posted by theZod on Stack Overflow See other posts from Stack Overflow or by theZod
Published on 2010-03-27T21:48:17Z Indexed on 2010/03/27 21:53 UTC
Read the original article Hit count: 244

Filed under:
|
|
|

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?

© Stack Overflow or respective owner

Related posts about div

Related posts about JavaScript