Есть ли способ иметь iframe в полноэкранном режиме? - PullRequest
0 голосов
/ 06 января 2019

Я хочу поместить iframe на мою страницу с другим элементом div поверх iframe, чтобы вернуться на определенную страницу, однако я не могу заставить iframe перейти на полный экран (высота: 100% и ширина: 100%). Есть ли какая-нибудь работа, чтобы получить iframe в полноэкранном режиме?

Я уже пытался установить высоту окна с помощью jquery, однако она не работает.

<style>    
    iframe {
      height:100%;
      width:100%;
    }

    .goback {
      width:100%;
      background-color:transparent;
      transition:.5s;
      position: absolute;
      z-index:3;
    }

    .goback img {
      padding:5px;
    }

    .goback:hover {
      background-color:white;
    }
</style>
<body>
    <div class="goback">

        <img src="../../assets/goback.png" alt="goback" height="50px" width="50px" />

    </div>

    <iframe src="https://music.youtube.com/"></iframe>

</body>

Ответы [ 3 ]

0 голосов
/ 06 января 2019

Вы должны изменить свой CSS (установите для поля тела значение 0, установите абсолютный фрейм iframe и установите границу в 0)

Пример:

body {
  margin: 0;
}

iframe {
  position: absolute;
  top: 0;
  left: 0;
  height:100%;
  width:100%;
  border: 0;
}
0 голосов
/ 07 января 2019

используйте

width:100%; height:100vh; 
из iframe.
0 голосов
/ 06 января 2019

Использовать ширину и высоту области просмотра вместо процентов

iframe {
  height:100vh;
  width:100vw;
 }
...