scroll a table

**veronique rossi** · Jul 23 '05, 11:27 AM

Re: scroll a table

Here is the solution I have found:

<body>
<div id="mydiv" style="width:10 0;overflow:auto ;background-color:#eeeeee;"
onscroll="scrol l(this)">
<table id="tblobjest1 " class="lst" cellspacing="0" cellpadding="0"[color=blue]
>[/color]
<tr id="row"><td>Ro w 1</td></tr>
<tr><td>Row 2</td></tr>
<tr><td>Row 3</td></tr>
<tr><td>Row 4</td></tr>
<tr><td>Row 5</td></tr>
<tr><td>Row 6</td></tr>
<tr><td>Row 7</td></tr>
<tr><td>Row 8</td></tr>
<tr><td>Row 9</td></tr>
<tr><td>Row 10</td></tr>
<tr><td>Row 11</td></tr>
<tr><td>Row 12</td></tr>
<tr><td>Row 13</td></tr>
<tr><td>Row 14</td></tr>
<tr><td>Row 15</td></tr>
<tr><td>Row 16</td></tr>
<tr><td>Row 17</td></tr>
<tr><td>Row 18</td></tr>
<tr><td>Row 19</td></tr>
<tr><td>Row 20</td></tr>
</table>
</div>

<script language='javas cript'>

var realLastScrollT op = 0;
var currentLastScro llTop = 0;
var nbLines = 4;

// init the "table" height
document.all['mydiv'].style.height = document.all['row'].clientHeight
* nbLines;

function scroll(o) {

var cellHeight = document.all['row'].clientHeight;

if (currentLastScr ollTop == o.scrollTop) {
// scroll action is stabilized
if (realLastScroll Top < o.scrollTop) {
o.scrollTop = (parseInt(o.scr ollTop/cellHeight)+1)* cellHeight;
}
else {
if (o.scrollTop > (nbLines -1 * cellHeight)) {
o.scrollTop = parseInt(o.scro llTop/cellHeight)*cel lHeight;
}
}
realLastScrollT op = o.scrollTop;
}
currentLastScro llTop=o.scrollT op;

}

</script>

**kaeli** · Jul 23 '05, 11:27 AM

Re: scroll a table

In article <7a5dfebc.04060 80537.7495302a@ posting.google. com>,
vrossi@ceitel.f r enlightened us with...[color=blue]
> Here is the solution I have found:
>[/color]

Your solution is IE only.
That is fine for some people. I just thought I'd mention it for the
archives.

--
--
~kaeli~
Why do people who know the least know it the loudest?

http://www.ipwebdesign.net/wildAtHeart

http://www.ipwebdesign.net/kaelisSpace

**Tim Slattery** · Jul 23 '05, 11:27 AM

Re: scroll a table

kaeli <tiny_one@NOSPA M.comcast.net> wrote:
[color=blue]
>In article <7a5dfebc.04060 80537.7495302a@ posting.google. com>,
>vrossi@ceitel. fr enlightened us with...[color=green]
>> Here is the solution I have found:
>>[/color]
>
>Your solution is IE only.
>That is fine for some people. I just thought I'd mention it for the
>archives.[/color]

How much is IE only? He uses syntax like:

var cellHeight = document.all['row'].clientHeight;

which can be made browser-independent by changing it to:

var cellHeight = document.getEle mentById("row") .clientHeight;

After clearing up addressing issues like that, what's left? Is
"clientHeig ht" maybe an IE only property?

--
Tim Slattery
Slattery_T@bls. gov

**Lasse Reichstein Nielsen** · Jul 23 '05, 11:27 AM

Re: scroll a table

Tim Slattery <Slattery_T@bls .gov> writes:
[color=blue]
> kaeli <tiny_one@NOSPA M.comcast.net> wrote:
>[color=green]
>>In article <7a5dfebc.04060 80537.7495302a@ posting.google. com>,
>>vrossi@ceitel .fr enlightened us with...[color=darkred]
>>> Here is the solution I have found:
>>>[/color]
>>
>>Your solution is IE only.
>>That is fine for some people. I just thought I'd mention it for the
>>archives.[/color]
>
> How much is IE only?[/color]

Hard to say. Since Opera is getting better and better at emulating IE,
some of it might not be IE-only, but will still fail in Mozilla.
[color=blue]
> He uses syntax like:
>
> var cellHeight = document.all['row'].clientHeight;
>
> which can be made browser-independent by changing it to:[/color]

Nothing is browser independent - Netscape 1 is still a browser :) So,
you have to make some assumptions about the browsers on the receiving
end. The fewer the better, but there will always be some.
[color=blue]
> var cellHeight = document.getEle mentById("row") .clientHeight;[/color]
[color=blue]
> After clearing up addressing issues like that, what's left? Is
> "clientHeig ht" maybe an IE only property?[/color]

In Mozilla, "clientHeig ht" seems to always give 0 for a table row.
So, probably.
/L
--
Lasse Reichstein Nielsen - lrn@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleD OM.html>
'Faith without judgement merely degrades the spirit divine.'

**kaeli** · Jul 23 '05, 11:27 AM

Re: scroll a table

In article <ocqbc0pmdhimrc 7krs27c15mpjqen ehbok@4ax.com>,
Slattery_T@bls. gov enlightened us with...[color=blue]
>
> How much is IE only? He uses syntax like:
>
> var cellHeight = document.all['row'].clientHeight;
>
> which can be made browser-independent by changing it to:
>
> var cellHeight = document.getEle mentById("row") .clientHeight;
>
> After clearing up addressing issues like that, what's left? Is
> "clientHeig ht" maybe an IE only property?
>[/color]

I am pretty sure clientHeight is IE only as well, but I was mostly
looking at the document.all stuff.

I am also not sure about the support for scrollTop.

AFAIK, both clientHeight and scrollTop are IE only, but someone correct
me if I'm wrong.

--
--
~kaeli~
Synonym: the word you use in place of a word you can't
spell.

http://www.ipwebdesign.net/wildAtHeart

http://www.ipwebdesign.net/kaelisSpace

**Tim Slattery** · Jul 23 '05, 11:29 AM

Re: scroll a table

kaeli <tiny_one@NOSPA M.comcast.net> wrote:
[color=blue]
>In article <7a5dfebc.04060 80537.7495302a@ posting.google. com>,
>vrossi@ceitel. fr enlightened us with...[color=green]
>> Here is the solution I have found:
>>[/color]
>
>Your solution is IE only.
>That is fine for some people. I just thought I'd mention it for the
>archives.[/color]

A little research shows that this syntax works in Mozilla Firefox:

<table>
<thead>
<tr>

</tr>
<tbody style="overflow :auto;height:20 0px">

</tbody>
<table>

This causes the a 200 pixel tall block of the body of the table to be
shown, along with a vertical scrollbar on the right side! For some
reason, Firefox decided to show only 387 pixels (as shown by the DOM
inspector) horizontally, and gave me a horizontal scroll bar as well!
I assume that I could explicitly specify a width in the style
attribute to control this tendency.

Submitting the same page to IE showed a very bizarre result: IE made
EACH ROW in the body 200 pixels tall! And MS now says they will update
IE only for new operating system releases. AAAUUUGGGG!!!

--
Tim Slattery
Slattery_T@bls. gov

**Tim Slattery** · Jul 23 '05, 11:30 AM

Re: scroll a table

Tim Slattery <Slattery_T@bls .gov> wrote:
[color=blue]
>kaeli <tiny_one@NOSPA M.comcast.net> wrote:
>[color=green]
>>In article <7a5dfebc.04060 80537.7495302a@ posting.google. com>,
>>vrossi@ceitel .fr enlightened us with...[color=darkred]
>>> Here is the solution I have found:
>>>[/color]
>>
>>Your solution is IE only.
>>That is fine for some people. I just thought I'd mention it for the
>>archives.[/color]
>
>A little research shows that this syntax works in Mozilla Firefox:
>
><table>
><thead>
><tr>
>
></tr>
><tbody style="overflow :auto;height:20 0px">
>
></tbody>
><table>
>
>This causes the a 200 pixel tall block of the body of the table to be
>shown, along with a vertical scrollbar on the right side! For some
>reason, Firefox decided to show only 387 pixels (as shown by the DOM
>inspector) horizontally, and gave me a horizontal scroll bar as well!
>I assume that I could explicitly specify a width in the style
>attribute to control this tendency.
>
>Submitting the same page to IE showed a very bizarre result: IE made
>EACH ROW in the body 200 pixels tall! And MS now says they will update
>IE only for new operating system releases. AAAUUUGGGG!!![/color]

A bit more: Firefox seems to add the horizontal bar to compensate for
the horizontal space lost to the vertical scroll bar. I'd call that a
bug. Interestingly, Netscape 7.02 displays this table perfectly.

--
Tim Slattery
Slattery_T@bls. gov

scroll a table

scroll a table

Comment

Comment

Comment

Comment

Comment

Comment

Comment