javascript - CSS オーバーフロー テーブルの行の配置

Question

div タブ内にテーブルがあります。テーブルには 40 行あり、div の高さはそのテーブルの 10 行を表示するように設定されています。CSS の overflow:auto を使用すると、40 行をスクロールできます。すべて順調です。

JavaScript を使用して、テーブルをプログラムで特定の行に配置するにはどうすればよいですか (つまり、プログラムでテーブルを行ごとに上下にスクロールします)。

Answer 1

はコンテナー DIV の ID で、 rowssuperHappyFunDivは 0 ベースの行インデックスです。

function scrollTo(row)
{
   var container = document.getElementById("superHappyFunDiv");
   var rows = container.getElementsByTagName("tr");

   row = Math.min(Math.max(row, 0), rows.length-1);
   container.scrollTop = rows[row].offsetTop;
}

要求された行をコンテナーの一番上までスクロールしようとします。IE6 および FF3 でテスト済み。