人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

HTMLについての質問です。
現在ブログのヘッダー部分に表を設置しており、その中にJavaScript生成した情報を表示しています。
その際、情報量が多い場合には

(略)
<td>
<div style="font-size:○○px;height:○○○px;overflow:auto;">
(略)

として、縦方向のスクロールバーを表示しています。(横方向のスクロールバーは出ないように、表示する情報を編集しています。)

これを表示する際、スクロールの位置を予め指定することはできるのでしょうか?
より具体的には、ページを開いた時点で2行目から表示されるようにスクロール位置を指定することは可能でしょうか?

●質問者: antipattern
●カテゴリ:コンピュータ ウェブ制作
✍キーワード:HTML JavaScript Overflow PX スクロール
○ 状態 :終了
└ 回答数 : 2/2件

▽最新の回答へ

1 ● kn1967
●50ポイント

適当なライブラリを回答して「これ使えば?」ってのも良いかと思ったのですが、

中身を知っておいたほうが良いかな?っと思ったのでサンプルを作ってみました。

<html>
<head>
 <style type="text/css">
 div { height:100px; width:300px; overflow:auto; }
 table { border:1px solid #000000; }
 tr { font-size:20px; height:40px; }
 td { border:1px solid #000000; }
 </style>
</head>
<body onLoad="document.getElementById('div1').scrollTop = 90;">
 <div id="div1">
 <table>
 <tr><td>あいう</td></tr>
 <tr><td>かきく</td></tr>
 <tr><td>さしす</td></tr>
 <tr><td>たちつ</td></tr>
 <tr><td>なにぬ</td></tr>
 </table>
 </div>
</body>
</html>

説明は不要かとも思いますが・・・、実際に必要なのは

document.getElementById('div1').scrollTop = 90;

の部分の数値調整だけです。

◎質問者からの返答

ありがとうございます。

全部読み込んでから動かす感じですね。

試してみたら出来ました。


2 ● Cherenkov
●40ポイント

overflow:autoしているdivにidを付けてjavascriptでスクロールする。

scrollTopに数値を代入するとピクセル分上下にスクロールします。

var h = document.getElementById('hoge');
h.scrollTop = 20

関連

◎質問者からの返答

ありがとうございます。

基本的には上の方と同じやり方ですね。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ