Table scroll bar control?

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
Roja
Tutorials Group
Posts: 2692
Joined: Sun Jan 04, 2004 10:30 pm

Table scroll bar control?

Post by Roja »

I have a table, with overflow:auto set.

There is an overabundance of text in one of the TD's, and it displays the vertical scrollbar (as intended).

However, I wonder if there is a way to scroll to the bottom of the td by default, whether via css or javascript.

Any ideas?
User avatar
Burrito
Spockulator
Posts: 4715
Joined: Wed Feb 04, 2004 8:15 pm
Location: Eden, Utah

Post by Burrito »

I've never tried it with a page element, but you could look into using the scrollTo method.

it might only work with 'window'...but would be worth a try to do something like:

Code: Select all

document.getElementById('someElement').scrollTo(x,y);
User avatar
Chris Corbyn
Breakbeat Nuttzer
Posts: 13098
Joined: Wed Mar 24, 2004 7:57 am
Location: Melbourne, Australia

Post by Chris Corbyn »

Some browsers also use scrollTop and scrollLeft but those are the correct lines to follow yes :) I had to do this fairly recently with a DHTML navigation menu so it moved with the page.

EDIT | I think burr is right... these are just window properties. Hmm.... there is a way... I've seen it done.
User avatar
Chris Corbyn
Breakbeat Nuttzer
Posts: 13098
Joined: Wed Mar 24, 2004 7:57 am
Location: Melbourne, Australia

Post by Chris Corbyn »

Using the write_r() function I wrote a found this.... in Opera at least since FF ground to halt doing the recursion.

A DIV has these properties which match the word "scroll":

[scrollHeight] => 34
[scrollLeft] => 0
[scrollTop] => 0
[scrollWidth] => 1010

[scrollIntoView] => function scrollIntoView() { [native code] }

So it looks like it can be done ;)
User avatar
Burrito
Spockulator
Posts: 4715
Joined: Wed Feb 04, 2004 8:15 pm
Location: Eden, Utah

Post by Burrito »

ahh yes...the ole scrollIntoView()...that's exactly what you need....good work d11. You'll probably need to just create a temporary element and scroll that into view.

Something like this should work:

Code: Select all

var temp = document.createElement("div");
document.getElementById('myScrollingTable').appendChild(temp);
temp.scrollIntoView();
I've done it before so I know it works... I just cant' remember where :P
Post Reply