Изменение формата изображения встроенного видео Youtube

<!DOCTYPE HTML> 
<head> 
<style> 

    body { 
     overflow: hidden; 
     margin:0; 
    }  
</style> 

</head> 
<body> 


    <iframe id="video" src="https://www.youtube.com/embed/U4c9bBeUe4M?modestbranding=1&showinfo=0" frameborder="0" allowfullscreen></iframe> 


<script src="https://code.jquery.com/jquery-1.12.3.min.js" integrity="sha256-aaODHAgvwQW1bFOGXMeX+pC4PZIPsvn2h1sArYOhgXQ=" crossorigin="anonymous"></script>  

<script> 

    $(function(){ 
     $('#video').css({ width: $(window).innerWidth() + 'px', height: $(window).innerHeight() + 'px' }); 

     $(window).resize(function(){ 
     $('#video').css({ width: $(window).innerWidth() + 'px', height: $(window).innerHeight() + 'px' }); 
     }); 
    }); 

</script> 
</body>

Как изменить размер, есть ли способ сделать iframe сжатым с видео? В настоящее время, когда он изменяется, есть огромный большой черный промежуток, и видео находится посередине.Изменение формата изображения встроенного видео Youtube

источник

2016-04-27 Velibor Nikolic

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

https://css-tricks.com/NetMag/FluidWidthVideo/Article-FluidWidthVideo.php

https://coolestguidesontheplanet.com/videodrome/youtube/

Надеется, что это помогает.

Это может быть проще сделать это способом CSS вместо использования javascript.

источник

2016-04-27 05:06:23

Здесь нет необходимости в javascript. Вы можете сделать это с помощью чистого css.

Это, как самозагрузки делает это:

Разрешить браузеры для определения размеров видео или слайд-шоу на основе ширины их содержащего блока, создавая характеристическую соотношение, что будет правильно масштабироваться на любое устройство.

http://codepen.io/partypete25/pen/XdPGmb?editors=1100#

Для 16by9 видео используйте:

.embed-responsive-16by9 { 
    padding-bottom: 56.25%; 
}

Для 4by3 видео используйте:

.embed-responsive-4by3 { 
    padding-bottom: 75%; 
}

источник

2016-04-27 06:08:03 partypete25

Изменение формата изображения встроенного видео Youtube

ответ

Смежные вопросы