469,338 Members | 8,155 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,338 developers. It's quick & easy.

controlling an overflow scroll bar

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

Mar 11 '06 #1
9 17495
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.
Mar 11 '06 #2
> You can set the scrollTop property of the div.

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

Thanks,
Peter

Mar 11 '06 #3
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

Mar 11 '06 #4
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/
Mar 11 '06 #5
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

Mar 11 '06 #6
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.
Mar 11 '06 #7
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
Mar 12 '06 #8
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

Mar 12 '06 #9
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/
Mar 12 '06 #10

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

15 posts views Thread by Andrew Fedoniouk | last post: by
3 posts views Thread by Ingrid | last post: by
1 post views Thread by ryan.champlin | last post: by
1 post views Thread by ernond_paul | last post: by
2 posts views Thread by Martien van Wanrooij | last post: by
2 posts views Thread by Jason Chu | last post: by
4 posts views Thread by reycri | last post: by
reply views Thread by asnowfall | last post: by
4 posts views Thread by Matthew Cox | last post: by
1 post views Thread by CARIGAR | last post: by
reply views Thread by suresh191 | last post: by
reply views Thread by Marylou17 | last post: by
1 post views Thread by Marylou17 | last post: by
1 post views Thread by Marylou17 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.