В настоящее время я работаю над сайтом, который показывает полноэкранное видео с помощью API проигрывателя vimeo. Проблема в том, что в зависимости от размеров окна браузера я получаю черные полосы, явно из-за несоответствия между соотношением сторон окна и видео.
Я пробовал довольно много комбинаций css и js, включая, помимо прочего, обычное решение для адаптивных видео, fitvids, но все безрезультатно.
тогда мой вопрос: возможно ли полноэкранное отзывчивое видео со встроенным проигрывателем vimeo или лучше отказаться от него и создать собственный проигрыватель самостоятельно, используя vimeo только для размещения видеофайлов?
если это поможет, вот соответствующий код:
HTML
<div id="video”>
<div id="video-container">
<iframe id="main-video" src="//player.vimeo.com/video/123456789?portrait=0&title=0&badge=0&byline=0&autoplay=1&color=333&api=1&player_id=main-video" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
</div>
</div>
CSS
#video {
position: fixed;
z-index: 10;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
#video-container {
position: fixed;
min-width: 100%;
min-height: 100%;
}
#main-video {
position: fixed;
min-width: 100%;
min-height: 100%;
}
заранее спасибо!