开发者

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 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?


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:

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜