controlling an overflow scroll bar

[petermichaux]

Hi,

Is it possible to use JavaScript to control how far down an overflowing
div is scrolled? The situation might be like the following.

<div style="overflow:scroll; height:3em;">
<p>One</p>
<p>Two</p>
<p>Three</p>
<p>Four</p>
<p>Five</p>
<p>Six</p>
</div>

Thanks,
Peter

[TheBagbournes]

pe**********@yahoo.com wrote:

Hi,

Is it possible to use JavaScript to control how far down an overflowing
div is scrolled? The situation might be like the following.

<div style="overflow:scroll; height:3em;">
<p>One</p>
<p>Two</p>
<p>Three</p>
<p>Four</p>
<p>Five</p>
<p>Six</p>
</div>

Thanks,
Peter

You can set the scrollTop property of the div. You'll need to identify
the div with an id, so that you can access it.

[petermichaux]

> You can set the scrollTop property of the div.

This works in all browsers? My 2002 book implies only in IE.

Thanks,
Peter

[petermichaux]

It seems to be working in Safari and Firefox.

The math seems strange. I can't seem to do things like

document.findElementById("of").scrollTop = "50%"
document.findElementById("of").scrollTop =
document.findElementById("of").scrollHeight/2

Any way to control by percentage?

Thanks,
Peter

[Randy Webb]

pe**********@yahoo.com said the following on 3/11/2006 12:42 PM:

It seems to be working in Safari and Firefox.

The math seems strange. I can't seem to do things like

document.findElementById("of").scrollTop = "50%"
document.findElementById("of").scrollTop =
document.findElementById("of").scrollHeight/2

Any way to control by percentage?

Try turning error reporting on and use getElementById or do you have
findElementById defined somewhere?

--
Randy
comp.lang.javascript FAQ - http://jibbering.com/faq & newsgroup weekly
Javascript Best Practices - http://www.JavascriptToolbox.com/bestpractices/

[petermichaux]

oops, sorry, I meant getElementById. Switching from Rails to JavaScript
can cause me some grief. Anyway I tried the example with
getElementById. I can do this

e = document.getElementById("of");
e.scrollTop = e.scrollHeight;

but actually that is way overkill. The scrollHeight is a number much
larger than necessary to scroll all the way to the bottom.

Any ideas about percentage control or something like it?

Thanks,
Peter

[TheBagbournes]

pe**********@yahoo.com wrote:

oops, sorry, I meant getElementById. Switching from Rails to JavaScript
can cause me some grief. Anyway I tried the example with
getElementById. I can do this

e = document.getElementById("of");
e.scrollTop = e.scrollHeight;

but actually that is way overkill. The scrollHeight is a number much
larger than necessary to scroll all the way to the bottom.

Any ideas about percentage control or something like it?

It's a pixel value, nothing like the CSS style values that take %ages.
You'll have to do the %age calculations yourself using scrollTop,
scrollHeight and clientHeight.

[Thomas 'PointedEars' Lahn]

pe**********@yahoo.com wrote:

Is it possible to use JavaScript to control how far down an overflowing
div is scrolled? The situation might be like the following.

Yes. But if there was no client-side script support it would not work, so
you should try a different approach first. One may be to tell what your
problem is in the first place instead of asking how something can be done
that you think is the solution to the problem.
PointedEars

[petermichaux]

It's for drag and drop. I'm want to make a dragged item automatically
scroll down an overflowing div.

Are there situations where JavaScript is available but when the
suggested solutions would not be supported?

Peter

[TheBagbournes]

pe**********@yahoo.com wrote:

It's for drag and drop. I'm want to make a dragged item automatically
scroll down an overflowing div.

Are there situations where JavaScript is available but when the
suggested solutions would not be supported?

You should use the Yahoo UI to do that. It handles auto scrolling during
a drag operation.

http://developer.yahoo.net/yui/