..

JavaScriptの入門とサンプル集
JavaScript入門−ウインドウ編(ウインドウをスクロールさせる)     ■戻る     ■次へ     ■Home

ウインドウをスクロールさせる

 ウインドウをサイズを変更するには、「window」オブジェクトの「scrollBy「scrollTo」というメソッドを使います。

ウインドウをスクロールさせる

   window.scrollBy(横幅,縦幅)
   window.scrollTo(横幅,縦幅)


   ウインドウをスクロールさせます
   「scrollBy」は相対座標でスクロール位置を指定します(現在位置からの移動量)
   「scrollTo」はドキュメントの左上端からの絶対座標でスクロール位置を指定します


 それでは、「scrollTo」メソッドを使って「ウインドウのサイズを変更する」のドキュメントをスクロールさせてみましょう。

<html>
<head>
<title>スクロール</title>

<script language="JavaScript"><!--
function winOpen()
{
   wy=0;
   myWin=window.open("03winsize.html","win",
"width=800,height=100,left=16,top=255");

   myWin.focus();








   winScroll();
}

function winScroll()
{
  wy+=1
   if(wy>300){retuen;}
   myWin.scrollTo(0,wy);
   setTimeout("winScroll()",5);
}

// --></script>


</head>

<body>
<a href="#" onClick="winOpen()">
ここをクリックするとサブウイウドウを開きます
</a>
</body>
</html>

〜sample18.html〜のリスト




関数「winOpen」の定義

スクロール位置のy座標を初期設定
サブウインドウを開きます


サブウインドウがすでに画面上にあって他のウインドウに隠れて
いた場合を想定して前面に呼び出します
■補足
 window.focus()  ウインドウをフォーカス(選択状態に)する

 window.blur()   ウインドウのフォーカスをはずします

「window」の部分をウインドウオブジェクトで指定することができますこのプログラムの場合は「myWin」
関数「winScroll」を実行します


関数「winScroll」の定義

スクロール位置のy座標に1加算します
スクロール位置が300を超えたらこの処理を抜け出します
スクロール位置を指定します
割り込みの設定、「setInterval」と違い設定後に一定間隔で
一度だけ指定した処理を実行します






リンクがクリックされたら関数「winOpen」を実行します


   ■sample18.htmlを実行する


sample18.htmlの実行画面


..

JavaScript入門−ウインドウ編(ウインドウをスクロールさせる)     ■戻る     ■次へ     ■Home


..