Как я могу войти в полноэкранный режим, используя только код Javascript/JQuery? Цель состоит в том, чтобы войти в полноэкранный режим, например, когда вы нажимаете F11 в браузере, но затем программно.
Получение полноэкранного режима в моем браузере с помощью jquery
Ответ 1
Вы можете активировать полноэкранный режим с использованием ванильного JavaScript без jQuery.
<!DOCTYPE html>
<html>
<head>
<title>Full Screen Test</title>
</head>
<body id="body">
<h1>test</h1>
<script>
var elem = document.getElementById("body");
elem.onclick = function() {
req = elem.requestFullScreen || elem.webkitRequestFullScreen || elem.mozRequestFullScreen;
req.call(elem);
}
</script>
</body>
</html>
Важно отметить, что вы можете запрашивать только полноэкранный режим, когда пользователь выполняет действие (например, щелчок). Вы не можете запрашивать полноэкранный режим без действия пользователя [1] (например, при загрузке страницы).
Вот кросс-браузерная функция для переключения полноэкранного режима (полученного из MDN):
function toggleFullScreen() {
if (!document.fullscreenElement && // alternative standard method
!document.mozFullScreenElement && !document.webkitFullscreenElement && !document.msFullscreenElement ) { // current working methods
if (document.documentElement.requestFullscreen) {
document.documentElement.requestFullscreen();
} else if (document.documentElement.msRequestFullscreen) {
document.documentElement.msRequestFullscreen();
} else if (document.documentElement.mozRequestFullScreen) {
document.documentElement.mozRequestFullScreen();
} else if (document.documentElement.webkitRequestFullscreen) {
document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
}
} else {
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.msExitFullscreen) {
document.msExitFullscreen();
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else if (document.webkitExitFullscreen) {
document.webkitExitFullscreen();
}
}
}
Для получения дополнительной информации посетите страницу MDN на полноэкранном интерфейсе API.
Ответ 2
Здесь приведена рабочая демонстрация для полнотекстового просмотра браузера
Ответ 3
Вы можете использовать свободно доступные jquery-плагины для этой цели, проверьте these- jquery full screen, Jquery full screen, jquery full screen
Ответ 4
Новая технология html5 - полноэкранный API дает нам простой способ представить содержимое веб-страницы в полноэкранном режиме. Мы собираемся предоставить вам подробную информацию о полноэкранном режиме. Просто попробуйте представить обо всех возможных преимуществах, которые вы можете использовать с помощью этой технологии - полноэкранных фотоальбомов, видеороликов и даже игр.
Но прежде чем мы опишем эту новую технологию, я должен отметить, что эта технология экспериментальна и поддерживается всеми основными браузерами.
Вы можете найти полный учебник здесь: http://www.css-jquery-design.com/2013/11/javascript-jquery-fullscreen-browser-window-html5-technology/
Здесь работает демо: http://demo.web3designs.com/javascript-jquery-fullscreen-browser-window-html5-technology.htm
Ответ 5
Если вам нужен плагин, поддерживающий версии IE до IE11 (IE8-10), посмотрите на jQuery.fullscreen. IE не поддерживал эту функцию изначально до IE11.
Ответ 6
Если вам нужна JQuery, чтобы упростить выбор элементов, вы можете сделать это:
var viewer = $("#parentid .classname .childelement")[0];
var rFS = viewer.mozRequestFullScreen || viewer.webkitRequestFullscreen || viewer.requestFullscreen;
rFS.call(viewer);
Ответ 7
Попробуйте ниже код
var el = document.documentElement,
rfs = el.requestFullscreen
|| el.webkitRequestFullScreen
|| el.mozRequestFullScreen
|| el.msRequestFullscreen
;
rfs.call(el);
Ответ 8
Это старый вопрос, но, возможно, кому-то это может понадобиться. Я искал решение для получения полноэкранного режима для браузера с помощью jQuery, и я нашел это решение. Я настоятельно рекомендую плагин Sindre Sorhus screenfull.js. Здесь вы можете получить файл.
https://github.com/sindresorhus/screenfull.js
На этой странице также можно найти информацию о том, как это сделать.
Ответ 9
Попробуйте с помощью метода window.resizeTo(x, y).
var w = window.open('','', 'width=100,height=100');
w.resizeTo(w.screen.availHeight, w.screen.availWidth);
w.focus();
Ответ 10
Если у вас есть кнопка или что-то еще, мы можем использовать этот скрипт:
<script language="JavaScript">
function fullScreen() {
var el = document.documentElement
, rfs = // for newer Webkit and Firefox
el.requestFullScreen
|| el.webkitRequestFullScreen
|| el.mozRequestFullScreen
|| el.msRequestFullScreen
;
if (typeof rfs != "undefined" && rfs) {
rfs.call(el);
} else if (typeof window.ActiveXObject != "undefined") {
// for Internet Explorer
var wscript = new ActiveXObject("WScript.Shell");
if (wscript != null) {
wscript.SendKeys("{F11}");
}
}
}
// End -->
С помощью кнопки. Все легко с помощью <a href="javascript:void(0);" onclick="fullScreen();"><BUTTON></a>
<a href="javascript:void(0);" onclick="fullScreen();"><BUTTON></a>
Но как загрузить этот скрипт в pageload. Это означает, что веб-форма будет полноэкранным в pageload без какого-либо нажатия на что-либо.