PDA

View Full Version : How to resize the DIV's Height?



guryu
09-28-2006, 12:51 AM
Hello all!
I have a problem,that is how to resize the DIV's Height by JavaScript.
I can't use the event of resize,resizeTo,resizeBy or onResize,because they are'nt used to the DIV tag.
HELP!!!

I extremely sorry for my express in english!
My means that I want to resize the DIV's Height automatically when the user changed the Browser's size.

DETAILS:
I have 3 DIV's in my page,the size of the two of the above was fixed.
My problem is that I want the third DIV's Height automatically resizable with user's drop and drag to the Browser.

Now the third DIV's Height was fixed.Between the bottom of the third DIV and the Browser have a blank. I'd like to erase this blank,and hope to third DIV's bottom near to the Browser's Status's bar.

clientHeight - DIV1's height - DIV2' height??

any suggestion please!


2006.09.28:confused:

jscheuer1
09-28-2006, 05:18 AM
Well, you can use the onresize event for the page to determine when to make adjustments to any individual element on a page.

clientHeight is IE specific and must be used as either document.body.clientHeight or document.documentElement.clientHeight if the inner height of the browser window is desired, the alternative used by other modern browsers is:

window.innerHeight

This function helps to determine how to know whether to use body or documentElement in IE:


function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body;
}

So you could do something like so, with the above function available:


onresize=function(){
var docy=window.innerHeight? window.innerHeight : iecompattest().clientHeight;
div3.style.height=docy-div1.offsetHeight-div2.offsetHeight+'px';
}

But, you could end up with zero or a negative number.

guryu
09-28-2006, 02:40 PM
I am very thanks for your anwser,but it not work in IE automatically untile you manually to refresh the Browser !

But great thanks for your HELP!

Your idea is so good !

guryu
2006.09.28:)

jscheuer1
09-28-2006, 04:50 PM
If done correctly, this should work. Sometimes the style or attributes of other elements on the page can interfere with this type of approach. If you can provide a link to a demo of what you've done, I should be able to work out what the problem is.