【おやじのweb技】 html/javascript/css等
TopPage表示 /  保 存 /  印 刷 /  Window Resize /  Window Close

k012

ウィンドウをフルスクリーンサイズにする

web工房  Copyright(C) 2004 web工房 All Rights Reserved 
このページのトップに戻る /  Window Resize /  Window Close /  最終更新日表示

action

リンク文字をクリックすると、ウィンドウの大きさが変わります。
ウィンドウ(フルスクリーン)

フルスクリーンにしたら下記を選択して、ウィンドウサイズを小さくして下さい。
ウィンドウ(800W×700H)  /  ウィンドウ(600W×400H)

web技

◆手順1【スクリプトの実行】
※<body〜</body>に記述します
※フルスクリーンにする場合
-----次の行から(copy)-----
<a href="javascript:winMax()"> ウィンドウ(フルスクリーン)</a>
-----上の行まで(copy)-----

※ウィンドウの大きさを指定するときは、ウィンドウの幅(W)と高さ(H)を指定してスクリプトを実行します
-----次の行から(copy)-----
<a href="javascript:winResize(800,700)">ウィンドウの大きさ(800W×700H)</a>
-----上の行まで(copy)-----

◆手順2【スクリプト】
※<head〜</head>に記述します

-----次の行から(copy)-----
<script type="text/javascript">
<!-- function winResize(W,H) {
  window.moveTo(100,100)
  window.resizeTo(W,H);
}

function winMax() {
  window.moveTo(0,0)
  window.resizeTo(window.screen.availWidth,window.screen.availHeight);
}
//-->
</script>
-----上の行まで(copy)-----

解説等

◆本技はウィンドウをオープンしてから(した後で)ウィンドウのサイズを変更する技です。

【類似技】
[技k005]ウィンドウをオープンしたときウィンドウのサイズを変える
※上記技の例として掲載していた技ですが、検索サイトからこられるお客さまで「ウィンドウ フルスクリーン」というように直接この技を探しておられる方が時々おられるようなので、技ファイルとして独立させました。
※本例でウィンドウをフルスクリーンにしたあと、もとに戻す技が本来の[技005]です。
※従って、本例の内容はほとんど[技k005]と重複しています。

◆フルスクリーンは正確には「全画面表示」ではありません。
※ウィンドウ右上のマークが全画面マークではなく □ になっているはず。これは全画面表示する、というときの記号ですね。
※スクリーンサイズにウィンドウサイズを合わせたものですから、ウィンドウ右下をドラッグしてウィンドウサイズをマニュアル変更することができます。

◆サイズを指定してウィンドウをオープンする(window.open)は
  [技k002]大きさや形式を指定して新しくウィンドウをオープンする
を参照して下さい。フルスクリーンモードでウィンドウをオープンする技も紹介されています。

keyword

◇window.resizeTo

注意

◆操作MENUの[Window Resize]を選択するとウィンドウサイズが変更可能です。インラインフレームの幅もウィンドウ幅に追従します。
◆上記の[web技]をクリップボードにコピーしテキストエディタに貼り付けて使用する場合は、表示のための改行記号や全角・半角スペースの記号等を削除して下さい。
-----次の行から(copy)-----
(この部分をクリップボードにコピーしてテキストエディタ等に貼り付けて下さい)
-----上の行まで(copy)-----