Dynamically resizing navigation div to main content
Greetings and Hello
I am trying to put together a wordpress site, now be开发者_如何学Ccause 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 codefunction 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?
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;
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:
精彩评论