Блог

Главная - Вопросы по программированию - Возможно ли создать полноэкранное HTML-всплывающее окно, подобное полноэкранному видеоплееру?

Возможно ли создать полноэкранное HTML-всплывающее окно, подобное полноэкранному видеоплееру?

#javascript #html #css #fullscreen

#javascript #HTML #css #полноэкранный

Вопрос:

Я хотел бы создать интерфейс, аналогичный полноэкранному видеоплееру, который выходит за пределы браузера на всю высоту и ширину монитора, но на основе HTML (т. Е. Я могу добавить фон и кнопки и использовать CSS для представления его пользователю).

Возможно ли это? Я думаю о HTML / CSS / Javascript, но открыт для любой технологии.

Комментарии:

1. Это можно сделать только с requestFullscreen()

2. Это отвечает на мой вопрос — если вы сформулируете это как ответ, я смогу на него ответить. Спасибо!

Ответ №1:

Чтобы создать что-то полноэкранное с помощью JS, вы должны использовать requestFullscreen() метод.

Из этой статьи:

 /* Get the element you want displayed in fullscreen mode (a video in this example): */
var elem = document.&etElementById("myvideo");

/* When the openFullscreen() function is executed, open the video in fullscreen.
Note that we must include prefixes for different browsers, as they don't support the requestFullscreen property yet */
function openFullscreen() {
  if (elem.requestFullscreen) {
    elem.requestFullscreen();
  } else if (elem.mozRequestFullScreen) { /* Firefox */
    elem.mozRequestFullScreen();
  } else if (elem.webkitRequestFullscreen) { /* Chrome, Safari and Opera */
    elem.webkitRequestFullscreen();
  } else if (elem.msRequestFullscreen) { /* IE/Ed&e */
    elem.msRequestFullscreen();
  }
}