テーブルのデータ行だけスクロールさせるには？

SANTA [E-Mail] 2000/01/24(月) 10:21:21
はじめまして。
早速ですが、ＤＢの内容をテーブルを使用して表示させたのですが、
タイトル<CAPTION>と項目タイトル<TH>の行も一緒にスクロールして、
下のほうのデータが見にくくて仕方ありません。
EXCELのウィンドウ枠の固定やACCESSのフォームみたいにタイトル行の固定表示は
出来ないのでしょうか？

ひつじ [E-Mail] 2000/01/24(月) 10:35:03
フレームで上下に分割して、上フレームにタイトル行を
下フレームに明細行を表示してます。でもこのやり方だ
と明細の内容によってタイトルと明細の列幅がずれたり、
ウィンドウが小さくなるとスクロールバーが出てタイト
ルが見えなくなったりするので、フレームで分けないや
り方があったら私も教えてほしいです。

SANTA 2000/01/24(月) 10:45:04
ひつじさん、早速のレスありがとうございます。
やっぱり、フレーム分割ですか。
いろいろなＨＰを見ても、無いんですよね。

市販のツールを使っても駄目ですかね？

ＥＭＩ 2000/01/24(月) 12:27:54
<TABLE>
<THEAD>

<TFOOT>

<TBODY>

</TABLE>

‥‥‥で、うまくいけばいいんだけどねぇ。
後は、ブラウザの対応待ちかな。(^^;

ＥＭＩ 2000/01/24(月) 12:42:30
追記です。
表下部の固定行がいらなければ、TFOOT要素は不要です。
というか、今のブラウザにまともな解釈は期待できないので、記述しない方が無難です。
後、THEADやTBODYの下にはTR以下を記述してください。

茶しぶ男 2000/01/24(月) 13:07:02
ひとつのバカな案として、聞いてください。

<FONT FACE="当幅のフォント名">
+------------+------+------+-------+<BR>
|銘柄　　　　|産地　|内容量|値段　 |<BR>
<TEXTAREA COLS=50 ROWS=5 SIZE=3>
|あきたこまち|新潟産|　10kg|\5,000-|
|あきたこまち|新潟産|　10kg|\5,000-|
|あきたこまち|新潟産|　10kg|\5,000-|
|あきたこまち|新潟産|　10kg|\5,000-|
|あきたこまち|新潟産|　10kg|\5,000-|
|あきたこまち|新潟産|　10kg|\5,000-|
|あきたこまち|新潟産|　10kg|\5,000-|
|あきたこまち|新潟産|　10kg|\5,000-|
|あきたこまち|新潟産|　10kg|\5,000-|
|あきたこまち|新潟産|　10kg|\5,000-|
|あきたこまち|新潟産|　10kg|\5,000-|
|こしひかり　|新潟産|　10kg|\6,000-|
|こしひかり　|新潟産|　 5kg|\3,400-|
</TEXTAREA><BR>
+------------+------+------+-------+<BR>

ずれるね。ダメだ、こりゃ。

SANTA 2000/01/24(月) 13:12:25
いろいろな方法ありがとうございます。
IEならＥＭＩさんの方法を・・・と思いましたが、
ネスケでも対応したい思っています。
両方対応するのって難しいですよね。

ＥＭＩ 2000/01/24(月) 13:21:44
IEでも対応してんのかなぁ。
自分で発言しておいてこんなことを言うのもなんですが、IEでもTFOOTが
表の下に表示されるのが関の山だと思います。
いや、実際試してないから何とも言えないけど。

あるいは、CSS2あたりを使えばどうにかなるのかな？
ただ、これもブラウザの対応状況が‥‥‥

ひつじ 2000/01/24(月) 13:33:58
THEADをIE4とIE5で試してみましたが、
だめですね。

茶しぶ男 2000/01/24(月) 13:37:09
先ほどの、おバカな案ですが。

<FORM>
<PRE>
+------------+------+------+-------+
|銘柄　　　　|産地　|内容量|値段　 |
<TEXTAREA COLS=50 ROWS=5>
|あきたこまち|新潟産|　10kg|\5,000-|
|あきたこまち|新潟産|　10kg|\5,000-|
|あきたこまち|新潟産|　10kg|\5,000-|
|あきたこまち|新潟産|　10kg|\5,000-|
|あきたこまち|新潟産|　10kg|\5,000-|
|あきたこまち|新潟産|　10kg|\5,000-|
|あきたこまち|新潟産|　10kg|\5,000-|
|あきたこまち|新潟産|　10kg|\5,000-|
|あきたこまち|新潟産|　10kg|\5,000-|
|あきたこまち|新潟産|　10kg|\5,000-|
|あきたこまち|新潟産|　10kg|\5,000-|
|こしひかり　|新潟産|　10kg|\6,000-|
|こしひかり　|新潟産|　 5kg|\3,400-|
</TEXTAREA>
+------------+------+------+-------+
</PRE>
</FORM>

のように変えてみたら、ネスケでは結構いい見栄えになりました。
ＩＥはズレが生じますけど。

おバカな案はこれぐらいにして。
ＥＭＩさんのを、ＩＥ５でやってみましたが、普通のＴＡＢＬＥと変わらない…。<TABLE RULES=groups>としたら、なぜか区切りの線がなくなったものの、やっぱりダメでした。

SANTA 2000/01/24(月) 13:54:07
現状のブラウザでは、無理みたいですね。
こういう使い方をしたいと思っている人は一杯いますよね。
ブラウザの対応を待つしかないのかな！？
悲しいです。

無責任官庁 2000/01/24(月) 14:10:41
とりあえず妥協案としては…
例えば１ページに２０行入る見積もりなら、１５行おきに見出しを入れる…とか。
そんな所ですかね。よくやる手としては。

無責任官庁 2000/01/24(月) 14:12:29
１ページに→１画面に
です。(^_^;)

うにゃうにゃ 2000/01/24(月) 19:51:14
きっとスクロールはできないでしょう。
（って、私はあきらめました。）
で代替え案としては、
１．１ページに収まるデータ量を決める。
２．１ページ以上のデータ量がある場合には、次ページボタン等を
出して、ページングする。
３．当然前も見たいので、前がある場合には前ページボタンも作成する。
ってなことを実際にやっています。
しかも私のばやいは、フレーム分割した中でこれをやっているので、
１ページに表示できる件数がやたら少ない・・・
ですが、逆転の発想として「スクロールをおこさせない」のはいかかでしょ。

通りすがり1号 2000/01/24(月) 21:35:24
発想を変えたらどうでしょうか？
データー行をスクロールさせるのではなく、
項目行を画面上で固定する。

具体的には
項目行をレイヤーに書いておき、ブラウザ画面内でスクロール
するたびにJavaScriptで位置を拾って再配置するというのは、
どうでしょうか？

通りすがり1号 2000/01/24(月) 23:25:30
とりあえずIE5で動くやつだけ作っときました。
NN4版は誰か作ってくれないかなぁ。

<html>
<head>
<title>test5</title>
<style>
body{
margin: 0;
padding: 0;
}
td {
background-color: #ccccff;
color: #000000;
}
#noscroll {
background-color: #000000;
position: absolute;
left: 0;
top: 0;
}
</style>
<script>
function getOnScroll(){
noscroll.style.pixelTop=window.document.body.scrollTop - window.document.body.clientTop;
noscroll.style.pixelWidth = document.body.clientWidth;
}
</script>
</head>
<body onload="getOnScroll()" onresize=getOnScroll(); onscroll=getOnScroll();>

<div id="noscroll">
<table width="100%">
<tr><td width="33%">head1</td><td width="33%">head2</td><td width="34%">head3</td></tr>
</table>
</div>
<table width="100%">
<tr><td width="33%">data</td><td width="33%">data</td><td width="34%">data</td></tr>
<tr><td >data</td><td>data</td><td >data</td></tr>
<tr><td >data</td><td>data</td><td >data</td></tr>
<tr><td >data</td><td>data</td><td >data</td></tr>
<tr><td >data</td><td>data</td><td >data</td></tr>
<tr><td >data</td><td>data</td><td >data</td></tr>
<tr><td >data</td><td>data</td><td >data</td></tr>
<tr><td >data</td><td>data</td><td >data</td></tr>
<tr><td >data</td><td>data</td><td >data</td></tr>
</table>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>
<br>
<hr>

</body>
</html>

ゆう 2000/01/25(火) 01:25:37
駄作ですが、見てやってください。
http://sites.netscape.net/yuheinoguchi/tbody.html
一応、クロスブラウザ。
注意点：
dhtmllibを使ってます。
クリップが適当。
スクロールバーに未対応。

SANTA 2000/01/25(火) 08:40:44
逆転の発想ですか。
実は、使用する人が不確定で、マシンの性能や解像度までまちまちなので、
ブラウザの大小に関係なく表示が出来たらいいなぁと思って作りたかったのです。
やっぱりある程度の制限をかけて作るしかないみたいですね。

とりあえず固定行に発想で作ってみます。
みなさんいろいろありがとうございました。
また、新しい事があったら教えてください。

通りすがり1号 2000/01/28(金) 22:09:46
まだ解決マークはいってないけど、考え中でしょうか？

固定行方法ならここのソースも参考になるのではないでしょうか？
http://www5.airnet.ne.jp/martin/CrossBrowser/function11.html

tky 2000/01/29(土) 03:37:16
CSSのoverflow:auto等使って、
データ部分だけをスクロールさせるのがベストなんでしょうが、
実装の問題がまたあるので、、、

JavaScriptで分岐させて、
IEの場合<iframe src="">、NNの場合<layer src="">を書き出す。
データのある外部ファイルを呼び出すというのはどうでしょう？

# でもNC5では、<layer>を破棄するとかって噂を聞きました。
# いったいどうなるんでしょう？

SANTA 2000/01/31(月) 09:05:00
[[解決]]
解決をチェックするのを忘れてすいませんでした。
固定行をJavaScriptの分岐方法で、実現しました。

>> # でもNC5では、<layer>を破棄するとかって噂を聞きました。
>> # いったいどうなるんでしょう？

ちょっと気になりますけれどその時にまた考えます。

いろいろありがとうございました。

[上に] [前に] [次に]