![](http://oshiete.xgoo.jp/images/v2/pc/qa/question_title.png?8acaa2e)
こんにちは、k-makotoと申します。
TABLEタグの質問があるのですが
↓のようなTableタグを作成しているのですが、
ヘッダの部分(名前、住所、TEL、E-Mail)を
横スクロールさせたときでも固定で表示させたいのですが
方法はあるのでしょうか?(縦方向のやり方はわかるのですが...)
-----------------------------------
|名前 | | |
-----------------------------------
|住所 | | |
-----------------------------------
|TEL | | |
----------------------------------
|E-Mail | | |
----------------------------------
No.3ベストアンサー
- 回答日時:
こんなんでどうでしょうか??
<HTML>
<HEAD>
<TITLE>横スクロールしないセル</TITLE>
<SCRIPT LANGUAGE="JavaScript">
function tdScroll(){
td1.style.pixelLeft = body.scrollLeft;
td2.style.pixelLeft = body.scrollLeft;
td3.style.pixelLeft = body.scrollLeft;
td4.style.pixelLeft = body.scrollLeft;
}
</SCRIPT>
<STYLE TYPE="text/css">
#td1,#td2,#td3,#td4{position:relative;}
</STYLE>
</HEAD>
<BODY id="body" onscroll="tdScroll()">
<TABLE border="1" width="200%">
<TR>
<TD width="100" id="td1">名前</TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
</TR>
<TR>
<TD id="td2">住所</TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
</TR>
<TR>
<TD id="td3">TEL</TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
</TR>
<TR>
<TD id="td4">MAIL</TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
<TD></TD>
</TR>
</TABLE>
</BODY>
</HTML>
お返事ありがとうございます。
lmeelmさんからいただいたソースを元にいろいろと作ってみました。
縦、横のスクロールもできるみたいですね。
横
td4.style.pixelLeft = body.scrollLeft;
縦
td4.style.pixelTop = body.scrollTop;
貴重なサンプルをいただき誠にありがとうございました。
lmeelmさんにお聞きしたいのですが、
td1.style.pixelLeft = body.scrollLeft; のような文法はどうやって
調べたのでしょうか?
たとえば上のtd1に対するプロパティやbodyのメソッドなど
どこかのHPにリファレンスがあるのでしょうか?
No.4
- 回答日時:
自分の場合は、どこかで知ったものなどを使ってどんどん自分でサンプルを作って保存しています。
そのどこかが知りたいのだと思いますが、それをどこで知ったかといわれると、、、、
どこで知ったんでしょう?自分でもよくわからないんです。
マイクロソフトのページやリファレンス系サイトなどを探索していて、知らないものがあったりすると、
すぐにそれを使ってどんどん自分でサンプルのようなものを作成して身につけたといった感じでしょうか。
迷ったときなどは、それをいわばリファレンス代わりのようにして使っています。
あんまし、いいお答えじゃありませんね。すんませんです。
お返事ありがとうございます。
現在の仕事でHTML、JavaScriptを使うもの
があるので私もいろいろリファレンス系サイトなどを探索して
サンプルを自分の所に保存して置いておくようにします。
![](http://oshiete.xgoo.jp/images/v2/common/profile/M/noimageicon_setting_02.png?8acaa2e)
No.1
- 回答日時:
ご質問の意味が良く理解できないですみません。
(私の勉強不足です)名前などの項目部分のサイズを固定するには
おのおのスタイルシートで指定すれば良いかと思います。
例えば下記のようになると思います。
<TABLE border="1" style='font-size : 12px;font-family : "MS Pゴシック";width : 500px;height : 200px;top : 40px;left : 10px;' width="785" height="203">
<TBODY>
<TR>
<TD style="width : 100px;height : 20px;">名前</TD>
<TD></TD>
<TD></TD>
</TR>
<TR>
<TD style="width : 100px;height : 20px;">住所</TD>
<TD></TD>
<TD></TD>
</TR>
<TR>
<TD style="width : 100px;height : 20px;">TEL</TD>
<TD></TD>
<TD></TD>
</TR>
<TR>
<TD style="width : 100px;height : 20px;">E-Mail</TD>
<TD></TD>
<TD></TD>
</TR>
</TBODY>
</TABLE>
下記URLもご参考に。
参考URL:http://tohoho.wakusei.ne.jp/wwwcss.htm
お返事ありがとうございます。
私の説明不足で申し訳ありませんでした。
私がしたかったのは
縦or横のヘッダの部分(名前、住所)をブラウザのスクロールをさせても
常に画面に表示させるようにしたかったのです。(Excelで列を固定するような)
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS 自身のHPにYouTube動画を貼り付けるのが出来なくなり困ってます 1 2022/11/11 10:44
- Visual Basic(VBA) ActiveReportのdetailをデータセットの自動バインドを使って帳票を出力しています。 1 2023/08/16 07:16
- IT・エンジニアリング ActiveReportのdetailをデータセットの自動バインドを使って帳票を出力しています。 1 2023/08/16 07:17
- Word(ワード) ワードで、任意の文字の前に、通し番号をつけたいです。 2 2022/09/15 02:40
- 確定申告 【白色申告】1月に引越したがe-taxでの納付先は新住所でいいのか? 2 2023/02/26 01:47
- WordPress(ワードプレス) ワードプレスで、投稿一覧ページにタグを表示する方法 投稿につけたタグを、記事一覧ページにもカテゴリと 1 2023/05/10 21:41
- PHP php エラー 2 2022/10/23 16:43
- PHP htmlで複数の個数入力欄を表示させるには 1 2022/09/20 03:11
- 物理学 物理の単振動の問題で分からない所を教えてください 1 2023/05/10 20:59
- 物理学 写真の図は単振動の動きを段階的に表したものです。 (加速度=a、力=kx、ばね定数=k、物体の質量= 8 2022/08/24 23:39
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
htmlの文字が縦書きになる
-
widthやheightの数値に単位(px...
-
表示倍率を変えるとレイアウト...
-
hpビルダー 複数の表の罫線を...
-
table周辺の隙間をなくしたい。
-
プルダウンで長い名前の選択肢...
-
画面の分割
-
div内に外部のurlを表示させたい
-
li 黒丸含んで移動する方法
-
css初心者 フレックスボックス...
-
背景が下まで表示されないんです。
-
CSS:animation開始位置の設定
-
cssが効かなくて困ってます
-
floatを使わずに、cssレイアウ...
-
HTMLで横幅をCSSで設定できませ...
-
左100px 中100% 右100px
-
画像イメージの上下左右、欲し...
-
form input テキストを上下中央...
-
メイン画像とグローバルメニュ...
-
HTMLでCSSでボーダーが表示され...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
htmlの文字が縦書きになる
-
widthやheightの数値に単位(px...
-
画像イメージの上下左右、欲し...
-
css初心者 フレックスボックス...
-
CSSでボックスのheightが0になる
-
CSS:animation開始位置の設定
-
CSS、width100%でもできる余白
-
スクロールボックスを中央に配...
-
form input テキストを上下中央...
-
W3Cのソースコードの検証サービ...
-
表示倍率を変えるとレイアウト...
-
CSSで背景画像を一番下にもって...
-
<div>と<div>の間の10px程の...
-
CSSがなぜかfont-sizeだけ効か...
-
footer を横幅いっぱいに広げる...
-
【CSS】ヘッダーの高さが不明の...
-
table周辺の隙間をなくしたい。
-
CSS3で角丸写真にシャドーを付...
-
定義リストに下線をつけたいと...
-
Media Queries 4 で 非推奨とな...
おすすめ情報