SITEMAP [初めてのホームページ講座] [JavaScript , DHTML] [FULL SCREEN SCRIPT]

Dynamic HTMLの参考書 Java Scriptの参考書

FULL SCREEN SCRIPT

機能

ブラウザを開くと殆どの場合、ツールバーやタイトルバーなどが表示され、コンテンツを表示できる領域は限られています。 これらの余分な部分を表示せずにフルスクリーンで表示します。 余分な飾りが表示されないため、様々なレイアウトが試せます。

ただし、閉じるボタンなども非表示なるため、ウインドウを閉じるスクリプトも必要になります。 また、IE4以上での対応です。

類似サンプル

  1. ちびウインドウ
  2. ウインドウリサイズ
  3. ウインドウリムーブ
  4. ウィンドウコントローラ

利用方法

HEAD部分にスクリプトを記述します。 リンク(Href属性)からこのスクリプトを呼び出します。 ブラウザによっては対応していないため、スクリプトで振り分けをします。

「fullscreen=1」でフルスクリーンを指定しています。 「href="JavaScript:window.close()"」でウインドウを閉じることが出来るので、 フルスクリーン側には必ず指定するようにしましょう。指定方法などは下記のみです。 サンプルには余分な機能などを多く追加しているだけです。

フルスクリーン指定
window.open("sp47_1.html","","fullscreen=1,scrollbars");
sp47_1.html
開く先のURL
fullscreen=1
フルスクリーン表示
scrollbars
スクロールバー非表示
※ウインドウを開く際のオプションはこの他にも多くあります。「ちびウインドウ」をご覧下さい。
ウインドウを閉じる
window.close()

ここでのサンプルには、「エンディング?!:2」との組み合わせをしています。

対応ブラウザ

IE4以上

サンプル

サンプルを見る] [ダウンロード

[Go To Top]

ソース

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html lang="ja">

<head>

<meta http-equiv="Content-Type" content="text/html;charset=Shift_JIS">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>FULL SCREEN SCRIPT</title>

<style type="text/css">
<!--
A{
	text-decoration:	none;
	font-size:			24pt;
	font-weight:		bold;
}
A:Link{
	color:				#00f;
}
A:Visited{
	color:				#66f;
}
A:Active{
	color:				#00f;
}
A:Hover{
	color:				#f00;
	text-decoration:	underline;
	background-color:	#fdd;
}
.center{
	text-align:			center;
}
-->
</style>

<script language="JavaScript">
<!--
var brw_v=navigator.appVersion.charAt(0);
var brw_n=navigator.appName.charAt(0);
var iIE4 = false;
if((brw_v >= 4)&&(brw_n == "M"))iIE4 = true;

function full(){
	if(iIE4){
		window.open("sp47_1.html","","fullscreen=1,scrollbars");
	}else{
		alert("IE4以上で可能です");
	}
}
// -->
</script>

</head>

<body>

<div class="center">
<a href="JavaScript:full()">FULL SCREEN</a><br>
<a href="JavaScript:history.back()">BACK</a>
</div>

</body>

</html>
[Go To Top]

Last modified Nov,2000
Copyright(C)2000 T.Miyazaki , All Rights Reserved.