«Предсказать» высоту видео контейнера в зависимости от соотношения сторон - PullRequest
0 голосов
/ 25 июня 2018

Вариант использования:

Предположим, я получил службу, которая отвечает либо с ошибкой, либо с URL-адресом видео для воспроизведения. Если видео есть, React отобразит видео, если нет - ошибку. Я хотел бы иметь там заполнитель / ошибку во всех ширинах / устройствах с одинаковой высотой всегда, как видео, которое должно прийти из службы.

Другими словами, я хотел бы применить правила, такие как: если я получил видео 16: 9, сделайте так, чтобы высота заполнителя ошибки равнялась высоте видео в этом размере экрана.

Как быстро вычислить эту высоту для соотношения сторон? Имеет ли это какой-то смысл?

Спасибо

1 Ответ

0 голосов
/ 25 июня 2018

Вы можете использовать трюк padding-bottom css для вашего контейнера в зависимости от соотношения сторон. Возьмите второе число и разделите на первое и сделайте его процентным значением:

1: 1 = 100% 16: 9 = 56.25% 4: 3 = 75%

https://css -tricks.com / коэффициент пропорциональности-боксы /

...