WEB相談室

Webページ作成に関しての何でも掲示板です。

タイトル:二つのDIVのスクロール(縦・横)を同時に表示したい

0:[投稿] K [2004/10/28 19:00 ][環境:IE6 IE6を想定]

こんにちは。
画面からはみ出てしまう大きいテーブルのスクロール表示について困っているので教えてください。
テーブルのサイズはブラウザの縦横を超えてしまう大きいものです。

一番上の行にはヘッダーのように列のタイトルを表示させる別のテーブルを設けています。
DIVで区切った大きさに縦横にスクロールさせたいのですが、その際、
テーブル上部のヘッダー部分は縦スクロールをさせずに固定にし、
横スクロールさせる場合にはヘッダー部も一緒にスクロールさせたいのです。

DIVで区切ってヘッダー部分を水平スクロールさせ、ヘッダー部分の下に書いたもうひとつのDIVで
垂直スクロールさせようとすると垂直スクロールが水平スクロールにくっついてしまいます。
つまり、水平スクロールを一番右までスクロールしないと垂直スクロールが出現しなくなってしまっているのです。
(言葉ではすごく説明しにくいのですが、お分かりいただけましたでしょうか…?)

要求する動作はどうしても実現したいので、皆様お知恵をお貸しください。
よろしくお願いいたします。


1:[回答] コトノハ [2004/10/29 11:38 ]

ヘッダーとボディとで違うテーブルにする。
横スクを指定する<DIV>は二つのテーブルを含める。
縦スクを指定する<DIV>はボディのテーブルのみを含める。

思い付いたまま言って見ました。
宜しければお試しくださいませ。


2:[質問] K [2004/10/29 20:41 ]

こんばんは。ありがとうございます。
ヘッダー部とボディ部はテーブルを分けています。
コトノハさんが仰っている方法でやっているのですが、うまくいきません。
やはりHTMLだけではムリなんでしょうか。
JavaScriptを使わないと実現できないのでしょうか。
引き続きどうぞお願いいたします。


3:[回答] ミチ [2004/11/01 16:45 ]

JavaScripを使わないと無理だと思います。
使用できない理由があるのでしょうか?


4:[質問] K [2004/11/02 11:03 ]

JavaScriptで実現できるということであれば、ぜひ使いたいです。
やはり、HTMLだけではムリなんですね…。
JavaScriptでやろうとすると、スクロールの度hidden領域に値を
書きにいく…という動きになるのでしょうか。
あまり方法が思いつかなくて、すみませんがヒントを下さい。
よろしくお願いします。


5:[回答] ミチ [2004/11/02 14:36 ]

ヘッダーの<DIV>にD1、ボディの<DIV>にD2とIDを付けた場合
onScrollで次を行ってください。

D1.scrollLeft = D2.scrollLeft;

ヘッダー部分がoverflow:hiddenになっていても動作します。
もしヘッダー部分にもスクロールを出すならば
逆の記述をしてください。


※ただしIEでしか動きません。


6:[完了] K [2004/11/04 10:34 ]

ミチ様、皆様、ありがとうございました。
onScrollで動作しました!
かなり長い間悩んでいたので感激です!
ありがとうございました。

回答(必須): 状態:

お名前(必須):

e-mail:

URL:




[戻る]

ChaichanPAPA's World