Webサイトでブラウザを強制的にフルスクリーンモードにできますか?
-
04-07-2019 - |
質問
参加者が大きな画像を見る必要がある心理学的研究を実行したい。
実験はWeb上で、したがってブラウザウィンドウで行われます。たとえば、ボタンを押したときなど、ブラウザに全画面表示にするよう指示することはできますか?
固定サイズのポップアップウィンドウを開く可能性があることを知っています。これは実行可能な代替手段になると思いますか?そして、それを行うための最良の方法は何でしょうか?ポップアップブロッカーを検出して、元のブラウザウィンドウでフォールバックして調査を実行するエレガントな方法はありますか。
主な懸念は、この研究の参加者は技術的な詳細に精通していないため、彼らに煩わされるべきではないということです。
解決
検索後にコードを見つけました。
function fullscreen() {
var element = document.getElementById("content");
if (element.requestFullScreen) {
if (!document.fullScreen) {
element.requestFullscreen();
$(".fullscreen").attr('src',"img/icons/panel_resize_actual.png");
} else {
document.exitFullScreen();
$(".fullscreen").attr('src',"img/icons/panel_resize.png");
}
} else if (element.mozRequestFullScreen) {
if (!document.mozFullScreen) {
element.mozRequestFullScreen();
$(".fullscreen").attr('src',"img/icons/panel_resize_actual.png");
google.maps.event.trigger(map, 'resize');
} else {
document.mozCancelFullScreen();
$(".fullscreen").attr('src',"img/icons/panel_resize.png");
}
} else if (element.webkitRequestFullScreen) {
if (!document.webkitIsFullScreen) {
element.webkitRequestFullScreen();
$(".fullscreen").attr('src',"img/icons/panel_resize_actual.png");
google.maps.event.trigger(map, 'resize');
} else {
document.webkitCancelFullScreen();
$(".fullscreen").attr('src',"img/icons/panel_resize.png");
}
}
}
html5 apiを使用します。 jqueryで特別な図を切り替えます。それが役立つことを願っています。現時点では、強制することができるかどうかはわかりません。なぜなら、それは正当なセキュリティのために禁じられていたからです。
他のヒント
F11を押すようにユーザーに伝えることができます。その横に、「なぜ?」リンクして、フルスクリーンモードにする必要があると感じる理由を説明してください。
ブラウザを強制的に全画面表示にすることはできないと思います。実際、それができたら、ブラウザに怒りを覚えます。あまりにも侵襲的です。 Flashにもセキュリティが備わっているため、プラグインを強制的に全画面表示にするには、ユーザーの操作に基づいてイベントを開始する必要があります。そのため、それがあなたにとってそれほど重要な場合、これはFlashプラグインを使用する正当な理由かもしれません。「開始クイズ」(または何でも)と言う誤解を招くボタンにgo-fullscreen呼び出しを添付できるからです。
しかし、そうしないでください。ユーザーと率直になり、F11キーを押すように伝えます。
編集:別のコメントで提供されているサンプルコードを試してみましたが、Firefoxはフルスクリーンウィンドウではなく、アドレスバーで最大化されたウィンドウを開きます。
現在のウィンドウのサイズを全画面に変更する方法はありませんが、ポップアップを全画面で開くことができます:
<script type="text/javascript">
<!--
function popup(url)
{
params = 'width='+screen.width;
params += ', height='+screen.height;
params += ', top=0, left=0'
params += ', fullscreen=yes';
newwin=window.open(url,'windowname4', params);
if (window.focus) {newwin.focus()}
return false;
}
// -->
</script>
<a href="javascript: void(0)"
onclick="popup('popup.html')">Fullscreen popup window</a>
IEでフルスクリーンモードで新しいウィンドウを開く:
<script>
<!--
window.open("page.html","fs","fullscreen,scrollbars")
//-->
</script>
「閉じる」を入れるpage.htmlのリンクはよい考えかもしれません:
<a href="#" onclick="window.close()">Close Window</a>
過去には、ウェブサイトがこれを行うのを見てきました。ただし、これは非常に迷惑であり、pr0n Webサイトの広告で一般的に使用されているため、最近のブラウザーではこの手法がブロックされている可能性があります。
しかし、重要な点は、それは非常に迷惑であり、pr0n Webサイトの広告で一般的に使用されるため、そのようなことを自分で関連付けたくないので、ユーザーにブラウザを最大化するように頼むのが最善です。
親ウィンドウを変更するには、次のようなものを試してください:
window.opener.location.href = '/confirmation/page.html';
F11はIEとFirefoxをフルスクリーンモードにします。 YouTubeや他のビデオストリーミングサイトでFlashを使用できるので、フルスクリーンにすることは可能ですが、javascriptを使用する方法はわかりません。
この機能は、フルスクリーンをサポートするモバイルブラウザーにとってより興味深いものです。ほとんどのモバイルブラウザには、オプションをタップして全画面表示するオプションはありません。アプリを少し操作するためにフルスクリーンに切り替える変更があります。