Как разрешить YouTube вставлять страницу переполнения контейнера видео - PullRequest
Новая
       47

Как разрешить YouTube вставлять страницу переполнения контейнера видео

0 голосов

У меня есть iframe с видео на YouTube. Он имеет несколько стилей, поэтому он может реагировать на ширину экрана, вы можете увидеть ниже.

HTML: 

<main role="main" class="container">
<div class="main-video fixed-top justify-content-center">
    <iframe class="video" width="1920" height="1080"
            src="https://www.youtube.com/embed/T0-P3AS4U4U?modestbranding=1&autohide=1&showinfo=0&controls=1&color=white">
    </iframe>
</div>

CSS: 

.main-video {
    z-index: 1;
    display: flex;
    position: absolute;
    top: 54px;
}

.main-video > .video {
    max-height: 600px;
    min-width: 100%;
    border: none;
}

Результат:

Result Result

Как разрешить переполнение самого видео (pi c 2), например на миниатюре (пи c 1), чтобы увидеть только его центр?

1 Ответ

0 голосов
/ 05 марта 2020

Это прекрасно работает, может помочь:) 

.main-video {
    z-index: 1;
    display: flex;
    position: absolute;
    top: 54px;
    flex-wrap:wrap;
  width:100vw;
  height:100vh;
}

.main-video > .video {
   border: none;
}
<div class="main-video fixed-top justify-content-center">
    <iframe class="video" width="100%" height="100%"
            src="https://www.youtube.com/embed/T0-P3AS4U4U?modestbranding=1&autohide=1&showinfo=0&controls=1&color=white">
    </iframe>
</div>
...