Windowオブジェクト その１
まず、JavaScriptのトップ階層にあるWindowオブジェクトで遊んでみましょう。
Windowオブジェクトは、ブラウザのウィンドウを表すオブジェクトです。と言ってもピンとこない人も
いると思いますが、いろいろ遊んでいるうちに自然と理解できると思います。
まずプロパティとしてstatus、メソッドとしては簡単なところでresizeTo, moveTo, moveBy
をとりあげてみます。
１ プロパティ
I.E.でいじれるWindowオブジェクトのプロパティはあまりありません。まあ遊べるとしたら
statusくらいでしょうか。status
プロパティはスタータスバー（ブラウザーの下部にある）に表示する
メッセージを表します。
window.status = "Hello";
と記述するとステータスバーにHelloと表示します。
下の例はステータスバーに文字をスクロール表示させるものです。（よくあるやつ）
実例はStatusバーに表示にあります。
| <script language="JavaScript"> <!-- var tid; cnt=0; blnk=" "; str=""; function msgin(){ msg=prompt("",""); str=blnk+msg; scroller(); } function scroller(){ f=1; window.status=str.substring(cnt++,str.length+1); if (cnt>str.length) cnt=0; clearTimeout(tid); tid=setTimeout("scroller()",200); } //--> </script> <form method="POST"> <p><input type="button" name="B1" value="メッセージ入力" onclick="msgin()"></p> </form> |
ステータスバーに表示する文字を入力 メッセージmsgに空白追加 scroller 呼び出し 文字列strからcnt分抜き出して、ステータスバー に表示。 200ミリ秒毎にscroller呼び出し ボタンをクリックすると、msgin呼び出し |
一定時間毎に同じ処理を繰り返したい場合は、ここの例のように
setTimeout を使い、自分自身（関数）
を呼び出します。これにより一定時間毎に同じ処理を繰り返すことができます。
setTimeoutは別の機会に説明したいと思います。
ネスケでは、以下のプロパティが使えるはずです。（確かめてません） I.E.では機能しません。
| outerHight | ウィンドウの横幅 |
| outerWidth | ウィンドウの縦幅 |
| menubar | メニューバーを表示するかどうか |
| statusbar | ステータスバーを表示するかどうか |
| toolbar | ツールバーを表示するかどうか |
| visible | ウィンドウの可視状態 |
２ メソッド
メソッドには、ちょっと遊べるものがそろっています。訪問者をびっくりさせる仕掛けが簡単にできます。
（１） ウィンドウのサイズを変える resizeTo
resizeToはウィンドウのサイズを変更します。
window.resizeTo(100,100);
とするとウィンドウを縦、横１００ピクセルのサイズに変更します。
実例はWindowのサイズを変えるを見てください。
Scriptは以下の通りです。簡単なScriptなので説明は省きます。
| <SCRIPT Language="JavaScript"> <!-- var x,y; function wresize() { x=prompt("Windowの横幅 １００以上",""); y=prompt("Windowの高さ １００以上",""); if (x<100) {x=100;} if (y<100) {y=100;} window.resizeTo(x,y); } // --> </SCRIPT> <form method="POST"> <p><input type="button" name="B1" value="サイズ変更" onClick="wresize()"></p> </form> |
（２） ウィンドウを移動する moveTo,
moveBy
moveTo は指定座標にウィンドウを移動させ、moveBy
は現在位置から相対的に移動させます。
以下のScriptはウィンドウを上下に揺らすはた迷惑なScriptです。
実例は地震！パソコンが揺れるをみて下さい。
| <!-- var cnt; cnt=0; function earth(){ if (cnt==0) {window.moveBy(20,20);} else{window.moveBy(-20,-20);} cnt=cnt^1; setTimeout("earth()",200); } // --> </script> |
cnt=cnt^1 の^は排他的論理和で、以下のような動きをするので、cntは0と1を交互に繰り返すこと
になります。
0 ^ 0 ->0
1 ^ 1 ->0
0 ^ 1 ->1
1 ^ 0 ->1
setTimeout("earth()",200); で200ミリ秒毎にearthが呼び出され、cntがそのたびに0と1に交互に
変わるので、ウィンドウが（斜め）上下に移動します。
（３） スクロールする scroll
scrollは指定した座標位置までウィンドウの内容をスクロールします。
window.scroll(x,y);
でウィンドウの内容を(x,y)の位置にスクロールします。
以下、タイマーで自動的に上にスクロールするJavaScriptです。
実例はScroll test
| <SCRIPT language="JavaScript"> <!-- y=0; function scrolltest() { if (y>600) y=0; window.scroll(0,y++); window.status=y; timer=setTimeout('scrolltest()',10); } scrolltest(); // --> |