Запрос JavaScriptПолный экран не работает в Edge - PullRequest
Новая
       34

Запрос JavaScriptПолный экран не работает в Edge

0 голосов
/ 14 декабря 2018

Я пытаюсь заставить видео (или что-нибудь еще) перейти в полноэкранный режим в браузере Edge через JavaScript.Но я не могу заставить его работать.В Chrome все работает как положено.

Я попробовал все шаги в инструменте командной строки js.Правильный HTML-элемент видео извлекается со строкой document.getElementById("video_player");.Затем я попытался ввести команду video.requestFullscreen();, но она ничего не делает.Даже не ошибка :(

Я активировал полноэкранный API в настройках about: flags и отключил все расширения браузера.

Элемент HTML-видео не находится внутри <code><iframe>

РЕДАКТИРОВАТЬ:

Это мой полный код. Файл JS загружается в конце документа HTML. Как вы можете видеть, он не делаетмного прямо сейчас. 

console.log("Running");

var video = document.getElementById("video_player");

FullScreenStart();

function FullScreenStart(){
    console.log("AutoFullScreen started");

    console.log(video);

    if (video.requestFullscreen) {
        video.requestFullscreen();
    } else if (video.mozRequestFullScreen) {
        video.mozRequestFullScreen();
    } else if (video.webkitRequestFullscreen) {
        video.webkitRequestFullscreen();
    } else if (video.msRequestFullscreen) { 
        video.msRequestFullscreen();
    }
}

function FullScreenOn(){
    console.log("FullScreen activated");
}

function FullScreenOff(){
    console.log("FullScreen deactivated");
}

document.onwebkitfullscreenchange = function(evt) {

    if(document.webkitIsFullScreen){
        FullScreenOn();
    } else {
        FullScreenOff();
    }
};

Пожалуйста, кто-нибудь может помочь мне заставить это работать? Я потратил два дня на эту проблему сейчас.

1 Ответ

0 голосов
/ 17 декабря 2018

Я выполнил тест с указанным выше кодом.

Я считаю, что ваш код не будет работать ни в одном браузере. Если вы вызываете полноэкранный API с помощью кода.

Я не уверенКак это работает с Chrome, как вы сказали в оригинальном сообщении.

Если вы ссылаетесь на документацию, вы можете найти информацию ниже.

Примечание. Этот метод должен вызываться при ответе навзаимодействие с пользователем или изменение ориентации устройства;в противном случае произойдет сбой.

Ссылка:

Element.requestFullscreen ()

Как сказано в документации, метод get не удался в обоих случаях.Chrome и Edge, если я вызываю его из кода, но он работает, если пользователь пытается вызвать его с помощью нажатия кнопки.

Пример кода: 

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>

<h2>Fullscreen with JavaScript</h2>
<p>Click on the button to open the video in fullscreen mode.</p>
<button onclick="openFullscreen();">Open Video in Fullscreen Mode</button>
<p><strong>Tip:</strong> Press the "Esc" key to exit full screen.</p>

<video width="100%" controls id="myvideo">
  <source src="rain.mp4" type="video/mp4">
  <source src="rain.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video>

<script>
/* Get the element you want displayed in fullscreen */ 
var elem = document.getElementById("myvideo");

/* Function to open fullscreen mode */
function openFullscreen() {
  if (elem.requestFullscreen) {
    elem.requestFullscreen();
  } else if (elem.mozRequestFullScreen) { /* Firefox */
    elem.mozRequestFullScreen();
  } else if (elem.webkitRequestFullscreen) { /* Chrome, Safari & Opera */
    elem.webkitRequestFullscreen();
  } else if (elem.msRequestFullscreen) { /* IE/Edge */
    elem.msRequestFullscreen();
  }
}
</script>

<p>Note: Internet Explorer 10 and earlier does not support fullscreen mode.</p>

</body>
</html>

Ссылка:

HTML DOM requestFullscreen () Метод

Это было сделано намеренно, потому что, если оно получитработать с кодом, чем многие сайты начинают показывать всплывающие окна, не спрашивая разрешения от пользователя.Что может раздражать пользователя.

...