cssのoverflow:autoとかでスクロールバーを表示して擬似フレームのような事ができますよね。

この擬似フレームをjavascriptでスクロールさせる事はできますか?
自分で試したところ、scrollByは上位オブジェクトはwindowのみのようで、できませんでした。何かいい方法があったら教えてください。

回答の条件
  • URL必須
  • 1人2回まで
  • 登録:2005/05/02 12:43:36
  • 終了:--

回答(2件)

id:Mars No.1

Mars回答回数203ベストアンサー獲得回数202005/05/02 21:42:09

ポイント100pt

大雑把なサンプルですが。(Win版 IE Firefox Operaでは動きました。Safariとかはわかりません。)


<html>

<head>

<title>Scroll Test</title>

<style type=”text/css”>

<!--

#d1{

width:200px;

height:80px;

overflow:auto;

border:1px solid #ccc;

}

-->

</style>

<script type=”text/javascript”>

<!--

var ScrollValue = 16;

function Dscroll(TargetID,Flag){

Target = document.getElementById(TargetID);

if(! Target) return;


if(Flag>0)Target.scrollTop+=ScrollValue;

else if(Flag<0)Target.scrollTop-=ScrollValue;

}

//-->

</script>

</head>

<body>

<div id=”d1”>

<p>テキスト</p>

<p>テキスト</p>

<p>テキスト</p>

<p>テキスト</p>

</div>

<p><input type=”button” value=”▲” onclick=”Dscroll(’d1’,-1)”>


<input type=”button” value=”▼” onclick=”Dscroll(’d1’,1)”></p>

</body>

</html>


※横スクロールさせるには scrollLeft を変更します。

id:waf

できました!リロードしてもスクロール位置が保持されるのが素敵ですね!

ところで、はてなは’と”が全角に置換されるようでちょっと使いづらいですね。

2005/05/03 08:27:56
id:PaulYamamoto No.2

Paul回答回数113ベストアンサー獲得回数22005/05/03 01:19:35

ポイント5pt

http://webmaster.hatena.ne.jp/1109577539

人力検索はてな - DIV ID=”Layer1” STYLE=”position:relative; overflow: auto; height:100;”>として div タグでoverflow: scroll; を使いはみ出た部分をスクロールするようにしているの..

同じ質問が以前に出てますね。

id:waf

おお、本当ですね。

2005/05/03 08:28:36

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

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

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

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

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