finding the height of a div

[wduty]

I have a DHTML scroller which acts like browser window which you can move up and down with two buttons. I need to prevent the content, (a moveable div containing text), from scrolling higher and lower than the top and bottom of the content. However, the content is asp generated and varies in size.<br><br>I can stop the window from scrolling down because I can stop the scrolling function when the top position of the div is lower than the top of the visible area. However, I don't know where the bottom of the div is (unless I can get the height somehow).<br><br>Any suggestions? <p>--Will Duty<br><a href=mailto:wduty@radicalfringe.com>wduty@radicalfringe.com</a><br><a href= > </a><br>

 

[TechDude]

someone correct me if i'm wrong but doesn't this work?
var x = document.all.divname.height;

or in the case of netscape

var x = document.layers['divname'].height;

[sig]<p>Chris Sorel<br><a href=mailto:chris@exnihilo.com>chris@exnihilo.com</a><br><a href=

http://www.exnihilo.com>Exnihilo</a><br>Remember,

If you continue to do what you have always done,<br>
you will continue to get what you have always gotten.[/sig]

 

[wduty]

Thanks for the suggestion.

Actually, that was the first thing I tried but it didn't work. I either go zero or no response. I did find that if I explicitly add a height value in the div's style attribute, I can read that value using code like what you have above.

Problem is, the div content is asp generated and varies in length depending on what the user requests. I also tried putting a div (positioned both relatively and absolutely) inside the main div at the bottom. This div &quot;goes along for the ride&quot; should give the position of the bottom of the containing div but that didn't work either.

Any further thoughts on this or other approches appreciated. [sig]<p>--Will Duty<br><a href=mailto:wduty@radicalfringe.com>wduty@radicalfringe.com</a><br><a href= > </a><br> [/sig]

 

[TechDude]

how about if you have your asp dynamically write a height value in your div
it shouldn't be a very complex calculation to come up with a height based on
the amount of information requested. Be careful of cross platform text size differences though (mac displays text much smaller).
That's probably what I would try.

[sig]<p>Chris Sorel<br><a href=mailto:chris@exnihilo.com>chris@exnihilo.com</a><br><a href=

http://www.exnihilo.com>Exnihilo</a><br>Remember,

If you continue to do what you have always done,<br>
you will continue to get what you have always gotten.[/sig]

 

[DubnerM]

try following:

var x = document.layers['divname'].document.height;

[sig]<p>Michael Dubner<br>Brainbench MVP/HTML+JavaScript<br>

http://www.brainbench.com<br>

[/sig]

 

[rycamor]

The value is easy to get in IE 4+. Just look at the documentation on getBoundingClientRect() at msdn.microsoft.com.

As for Netscape, I think you will have a little more trouble with that, at least until Mozilla/Netscape6.

If you want to be compatible with both browsers, you probably are best just calculating a width and height based on the text string length and experimenting with the different browsers. [sig][/sig]

 

[wduty]

Actually, I was getting ready to try the asp approach suggested by Chris Sorel as a last resort but...

Michael Dubner's suggestion worked. However, that only took care of Netscape.

To do the IE scripting, I finally got going and went to MSDN and looked up their object model. It wasn't that easy to find but the apparent way to find div properties in IE is: document.all[&quot;divname&quot;].offsetHeight;

So to wrap this up, the way to get div heights from what I've gathered is:

Internet Explorer:
-----------------------------
[red]document.all[&quot;divname&quot;].offsetHeight;[/red]

Netscape Navigator:
-----------------------------
[red]document.layers[&quot;divname&quot;].document.height;[/red]

Note that the IE code is case sensitive. e.g. offSetHeight won't work.
The IE object model is really pretty robust and has all kinds of interesting properties and methods. Unfortunately, since many of these features only work in IE, nobody really bothers to learn them, including myself.

Thanks to both of you for your time and suggestions! [sig]<p>--Will Duty<br><a href=mailto:wduty@radicalfringe.com>wduty@radicalfringe.com</a><br><a href= > </a><br> [/sig]

 

[wduty]

I didn't see rycamore's suggestion until after I posted the last note. The getBoundingClientRect() looks like it would work OK but I already implemented the offsetHeight I posted above and that seems to work fine. Also the netscape solution above seems work fine at least in Netscape Communicator 4.5 PC and Mac Communicator 4.72.

You can see where I used this at:

http://www.radicalfringe.com/radicalfringe/projects.asp

Hold down the mouse on the up and down arrows to the right of the main text area. The scrolling should stop when you get to the bottom of the available text. (If you find any bugs pleez let me know!)

[sig]<p>--Will Duty<br><a href=mailto:wduty@radicalfringe.com>wduty@radicalfringe.com</a><br><a href= > </a><br> [/sig]

 

[TechDude]

looks good,

that's a pretty cool application.
[sig]<p>Chris Sorel<br><a href=mailto:chris@exnihilo.com>chris@exnihilo.com</a><br><a href=

http://www.exnihilo.com>Exnihilo</a><br>Remember,

If you continue to do what you have always done,<br>
you will continue to get what you have always gotten.[/sig]

 

[ackka]

thank you wduty, i have been looking for this method for a while now
[sig]<p>ackka<br><a href=mailto:tmoses@iname.com>tmoses@iname.com</a><br><a href=

http://home.cyberarmy.com/ackka>

my site</a><br>"Do No Harm, Leave No Tracks"<br>
ICMP Summer 2000, 2600 Article<br>
<br>
[/sig]