[JS]ページ全体やコンテンツ（画像や動画）をフルスクリーンで表示するだけのシンプルなスクリプト -BigScreen | コリス

指定したエレメントをクリックすると、ページ全体をフルスクリーンで表示したり、画像や動画をフルスクリーンで表示するシンプルで超軽量（1KB）のスクリプトを紹介します。 BigScreenの特徴 BigScreenはページ全体やコンテンツをフルスクリーンで表示するシンプルで軽量（minified:1KB）のスクリプトです。 対応ブラウザ 動画コンテンツの表示は下記もサポートします。 BigScreenのデモ デモはサイトのタイトル（BigScreen）のテキストをはじめ、画像や動画などをクリックすると、フルスクリーンで表示します。 BigScreenのデモ：ページ全体 タイトル（BigScreen）をクリックします。 BigScreenのデモ：画像 画像をクリックします。 BigScreenのデモ：動画 動画は右下のボタンをクリックします。 BigScreenの使い方 Step 1: 外部ファイル 当スクリプトを外部ファイルとして記述します。 Step 2: JavaScript まずは、フルスクリーンに表示する際にベースとなる記述です。 document.getElementById('button').addEventListener('click', function() { if (BigScreen.enabled) { BigScreen.toggle(); } else { // 非対応ブラウザ用の処理 } }, false); エレメント（target）を指定して、それをクリックするとフルスクリーン表示にします。 var element = document.getElementById('target'); document.getElementById('button').addEventListener('click', function() { if (BigScreen.enabled) { BigScreen.request(element); // You could also use .toggle(element) } else { // 非対応ブラウザ用の処理 } }, false); フルスクリーンの状態を検出します。 BigScreen.onenter = function() { // フルスクリーン表示に入る時の処理 } BigScreen.onexit = function() { // フルスクリーン表示から出る時の処理 }

http://bit.ly/U9SezN