Адаптивность видео, встраиваемого с YouTube

Tracktor
1.4K
0
Возможно, ли как-то сделать видео, встраиваемое с YouTube, адаптивным в Bootstrap 3? IRFAME неуправляем :( Почему-то ширина, равная 100%, отлично работает, а вот высота, равная «auto» — совершенно не автоматизируется… Да и вообще, хотелось бы уйти от iframe. Есть ли альтернативный способ? Речь именно про видео с YouTube (HTML5 video работает, но нужно держать файл у себя на сервере)…

Комментарии ()

  1. Александр Мальцев
    08 марта 2017, 04:26
    Здравствуйте, в Bootstrap есть и для этого случая шаблон. Он может использоваться для элементов iframe, embed, video и object.
    Например:
    <!-- Соотношение сторон 16:9 -->
    <div class="embed-responsive embed-responsive-16by9">
      <iframe class="embed-responsive-item" width="560" height="315" src="https://www.youtube.com/embed/p-Sdyj9qnmY" allowfullscreen></iframe>
    </div>
    <!-- Соотношение сторон 4:3 -->
    <div class="embed-responsive embed-responsive-4by3">
      <iframe class="embed-responsive-item" width="560" height="315" src="https://www.youtube.com/embed/p-Sdyj9qnmY" allowfullscreen></iframe>
    </div>
    
    <!-- Атрибут frameborder="0" для элемента iframe указывать не надо -->
    
    Войдите, пожайлуста, в аккаунт, чтобы оставить комментарий.