Scroll a <table> Up/Down a bit ?

Mel Smith

unread,

Oct 12, 2012, 1:26:31 PM10/12/12

to

Hi:

I have a big 3-column table with <td> cells that are outlined and
contains approx 10 <br /> rows in each of the <td> cells.

There are two objects (e.g., id="abc123") in each of these <td> cells.

In JS, I use :

abc123el.scrollIntoView(); // to bring up a specific cell into
view -- which is pretty big vertically.

However, this scrollIntoView() operation scrolls the table/cell up a bit too
far, and I wish to scroll *down* a number of pixels --- say 5 or 10 px.

Question:

So, after my scrollIntoView() operation, how do I 'scroll up/down a bit'
programmatically ?

Thank you.

-Mel Smith

Danny

unread,

Oct 12, 2012, 2:07:46 PM10/12/12

to

window.scrollBy(X,Y), to get say 10px down, window.scrollBy(0,10);

Mel Smith

unread,

Oct 12, 2012, 3:07:50 PM10/12/12

to

Danny said:

> window.scrollBy(X,Y), to get say 10px down, window.scrollBy(0,10);

Danny:

I don't wish to scroll the _whole_ window--- just the <table> and its
rows which are embedded in a separate <div>

I'd 'like to say' : mytableobj.scroll-up-a-bit ; or
mytableobj.scroll-down-a-bit;

or something like that.

Thanks for the response !

-Mel Smith

Evertjan.

unread,

Oct 12, 2012, 3:08:19 PM10/12/12

to

Danny wrote on 12 okt 2012 in comp.lang.javascript:

> window.scrollBy(X,Y), to get say 10px down, window.scrollBy(0,10);

Usenet is not email.

Please quote what you are responding on.

--
Evertjan.
The Netherlands.
(Please change the x'es to dots in my emailaddress)

Danny

unread,

Oct 12, 2012, 4:04:54 PM10/12/12

to

ok Mel, then
PARENTOFELEMENT.scrollTop+=10; // to scroll that many pixels
check example at -> http://www.webdevout.net/test?04k&raw

Mel Smith

unread,

Oct 12, 2012, 5:12:51 PM10/12/12

to

Hi Danny:

Thak you, I'll try that over the weekend.

-Mel

Mel Smith

unread,

Oct 13, 2012, 12:10:05 PM10/13/12

to

Danny said:

>> PARENTOFELEMENT.scrollTop+=10; // to scroll that many pixels
>> check example at -> http://www.webdevout.net/test?04k&raw
>
> Hi Danny:
>
> Thak you, I'll try that over the weekend.
>
> -Mel
>

Hi Danny:

It worked great !!

I've put my actual code below.

Thank you !

-Mel Smith

******* code to bring listing into wiew, then vertically position it better
***
function liteup(nmlsid) {
var mlsid= nmlsid.toString() ;
var gmlsid = "G"+mlsid ;
var gmlsobj = document.getElementById(gmlsid) ;
gmlsobj.scrollIntoView() ; // rough positioning
// lite up the address first
gmlsobj.style.background="blue" ;
gmlsobj.style.color="white" ;
// now liteup the mls number
var mlsobj = document.getElementById(mlsid) ;
mlsobj.style.background="blue" ;
mlsobj.style.color="white" ;
// now move the table/row/cell down a bit //This next is from Danny
document.getElementById("listings").scrollTop -= 36; // Thanks Danny !
return true ;
}
***************************************

Dr J R Stockton

unread,

Oct 13, 2012, 2:42:36 PM10/13/12

to

In comp.lang.javascript message <adr268...@mid.individual.net>, Fri,
12 Oct 2012 11:26:31, Mel Smith <med_cuto...@aol.com> posted:

> So, after my scrollIntoView() operation, how do I 'scroll up/down a bit'
>programmatically ?

With sufficient desperation, you could try embedding the Table in an
iframe embedded in your existing page, which might allow you in effect
to use the scrolling functions of the iframed body element to scroll
just the Table. Untested.

Alternatively, you might be able to put at the beginning of the Table a
row whose height in pixels is controlled by CSS & JavaScript; then
scroll the Table as you already do to the right region and then ease it
up or down by altering the first row height by a few pixels.

Except that you should use not px but em or ex for those, since your
valuable readers might be using the esteemed Zoom Text Only mode of
Firefox & (IIRC) Safari.

--
(c) John Stockton, nr London, UK. For Mail, see Home Page. Turnpike, WinXP.
Web <http://www.merlyn.demon.co.uk/> - FAQ-type topics, acronyms, and links.
Command-prompt MiniTrue is useful for viewing/searching/altering files. Free,
DOS/Win/UNIX now 2.0.6; see <URL:http://www.merlyn.demon.co.uk/pc-links.htm>.

Mel Smith

unread,

Oct 14, 2012, 10:45:40 AM10/14/12

to

Dr. J said:
>
> With sufficient desperation, you could try embedding the Table in an
> iframe embedded in your existing page, which might allow you in effect
> to use the scrolling functions of the iframed body element to scroll
> just the Table. Untested.
>
> Alternatively, you might be able to put at the beginning of the Table a
> row whose height in pixels is controlled by CSS & JavaScript; then
> scroll the Table as you already do to the right region and then ease it
> up or down by altering the first row height by a few pixels.
>
> Except that you should use not px but em or ex for those, since your
> valuable readers might be using the esteemed Zoom Text Only mode of
> Firefox & (IIRC) Safari.
>
> --
> (c) John Stockton, nr London, UK. For Mail, see Home Page. Turnpike,
> WinXP.
> Web <http://www.merlyn.demon.co.uk/> - FAQ-type topics, acronyms, and
> links.
> Command-prompt MiniTrue is useful for viewing/searching/altering files.
> Free,
> DOS/Win/UNIX now 2.0.6; see
> <URL:http://www.merlyn.demon.co.uk/pc-links.htm>.

Dr. J:

Please see my earlier post. Danny gave me a good, quick solution which
I implemented.

Thanks anyway for the response.

-Mel