Полный экран на кнопке в рамке

Question

Как вызвать полноэкранный режим в рамке на моем сайте? Спасибо ...

<iframe width='640' height='360' src='https://roundme.com/embed/11663/28535' frameborder='0' webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

Answer 1

Вам нужно запросить разрешение пользователя на полный экран, я верю. Это сообщение MDN более подробно. Если вы зайдете на сайт caniuse.com, то увидите, что есть частичная поддержка, не забудьте проверить предостережения.

Согласно MDN вам нужно позвонить requestFullScreen на элемент.

Некоторые HTML:

<video controls id="myvideo">
  <source src="somevideo.webm"></source>
  <source src="somevideo.mp4"></source>
</video>

Некоторые JS для этого:

var elem = document.getElementById("myvideo");
if (elem.requestFullscreen) {
  elem.requestFullscreen();
}

Обязательно ознакомьтесь с документацией, поскольку в ней упоминаются некоторые интересные предостережения CSS между браузерами Gecko и Webkit.

Answer 2

В разделе CSS добавить

<style type="text/css">
  iframe{
   width: 100%;
   height: 100%;
   position: absolute;
  }