HTML 5 видео CSS: принудительное реагирование 16: 9 на видео-постер (для предварительной загрузки = "нет" видео) - PullRequest
Новая
       120

HTML 5 видео CSS: принудительное реагирование 16: 9 на видео-постер (для предварительной загрузки = "нет" видео)

1 голос
/ 16 апреля 2020

Предполагая, что размер плаката для видео HTML 5 всегда должен быть 16: 9, но высота реального видео все еще остается автоматической. Как я могу заставить изображение плаката придерживаться этих размеров (оно должно быть обрезано, чтобы соответствовать размерам, например, с подгонкой объекта)? 

video {
  width:100%;
  height:auto;
}

video[poster] {
  width:100%;
}
<video poster="https://i.imgur.com/LFgR8jD.png" controls="controls" class="pimcore_video" preload="none">
<source type="video/mp4" src="https://storage.coverr.co/videos/sksZ7cBoTBAJkB4Bul46QAI1c01x7lx18?token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJhcHBJZCI6IjExNDMyN0NEOTRCMUFCMTFERTE3IiwiaWF0IjoxNTg3MDMwNzIwfQ.moAIavql_5_ggd9hrKExX6iPeo2UM_CMya6Mozg4hyY">
</video>

Как видно из фрагмента выше, размер изображения постера отличается от самого видео.

...