CSS/javascrip に詳しい方への質問です。


インラインフレームを使わずスクロール画面をはめ込んでいます。

<div style=”overflow-y:scroll; height:40px;width:100px;”>
<p>
top<br>
aaa<br>
aaa<br>
aaa<br>
aaa<br>
aaa<br>
bottom<br>
</p>
</div>


たとえば上記のようなHTMLを表示させた場合、スクロールバーは最上部が表示されるよう一番上に位置しています。

これを、表示したときに最下部が見える状態にしたい(スクロールバーを最下部にもっていきたい)のですが、よい方法を教えてください。

よろしくお願いします。

回答の条件
  • URL必須
  • 1人2回まで
  • 登録:2006/02/27 18:22:42
  • 終了:--

回答(5件)

id:jippu No.1

jippu回答回数61ベストアンサー獲得回数42006/02/27 18:53:02

ポイント10pt

要は、上記の「bottom」が表示されるようになればよいのでしょうか。

だとしたら、「bottom」にアンカーをつけ、


<a href=”#bottom”>bottom</a>


onLoadでそこへジャンプさせれば良いかと思います。


<body onload=”go_bottom()”>


Javascriptの関数の中身は


function go_bottom(){

location.hash = ”bottom”;

}


といった感じで。


見当違いでしたら申し訳ございません。

id:yoski

なるほど、ありがとうございます。これでも実現できそうですね。

DHTMLで動的に書いているものなので、できればアンカーをつけずに処理する方法もお待ちしています。

2006/02/27 19:02:02
id:Mars No.2

Mars回答回数203ベストアンサー獲得回数202006/02/27 19:08:29

ポイント40pt

例)WinIE6とFirefox1.5で確認済。


<html><head><title></title>

<script type=”text/javascript”>

<!--

function go_bottom(targetId){

O = document.getElementById(targetId);

if(! O) return;

O.scrollTop = O.scrollHeight;

}

//-->

</script>

</head>

<body onload=”go_bottom(’area01’)”>

<div style=”overflow-y:scroll;height:40px;width:100px;” id=”area01”>

<p>

top


aaa


aaa


aaa


aaa


aaa


bottom


</p>

</div>

</body>

</html>

id:yoski

ありがとうございます!

2006/02/27 19:46:54
id:jippu No.3

jippu回答回数61ベストアンサー獲得回数42006/02/27 19:11:04

ポイント30pt

bottomというマーキングでなく“最下部に”ということであれば、scroll関数が使えます。


scroll(0, innerHeight);


などとすれば、ウィンドウ内枠の高さ分までスクロールさせることができます。


詳しそうな方ですので、関数とURLだけで失礼します。

id:yoski

ありがとうございました!

2006/02/27 19:47:17
id:Mars No.4

Mars回答回数203ベストアンサー獲得回数202006/02/27 19:14:27

ポイント20pt

二回に分けてしまってすいません。

overflow-y:scroll;

overflow:auto;

に変更すればOperaとか他のブラウザでも動くと思います。

overflow-yはIEの独自拡張なので(Firefoxも1.5から対応しましたが)

id:yoski

おお、そうだったのですね。ありがとうございます!

2006/02/27 19:47:32
id:suVene No.5

suVene回答回数6ベストアンサー獲得回数02006/02/27 19:18:13

ポイント20pt

div タグに id をつけ、エレメントを取得し

カレントスクロールのTOPを高さに割当てます。


function _onload() {

var el = document.getElementById(’target’);

el.scrollTop = el.scrollHeight;

}

id:yoski

みなさん、ありがとうございました

2006/02/27 19:47:48

コメントはまだありません

この質問への反応(ブックマークコメント)

トラックバック

  • フレームを使わず限定してスクロールさせる ・やりたいこと  −縦に複数並ぶテキストエリアに対して、ページ上1つの入力支援ボタンから入力を制御したい。 ・課題  −テキストエリア
  • 地道にメモろう 2008-06-18 03:57:24
    [CSS]*1213727735*フレームを使わず限定してスクロールさせる やりたいこと 縦に複数並ぶテキストエリアに対して、ページ上1つの入力支援ボタンから入力を制御したい。 課題 テキストエリア
  • フレームを使わず限定してスクロールさせる **やりたいこと 縦に複数並ぶテキストエリアに対して、ページ上1つの入力支援ボタンから入力を制御したい。 課題 テキストエリアが縦に複数
「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません