Эй, ребята,
странная ситуация, когда я понятия не имею, как это решить.
Я пытаюсь создать адаптивный сайт с медиазапросами. Встраиваемые ролики YouTube также реагируют на макет, поэтому я пытаюсь установить для каждого видео значение 100% и рассчитать его высоту в соотношении!
Результат выглядит так:
<p class="youtube-vid">
<object width="100%" height="61%">
<param name="movie" value="http://www.youtube.com/v/rBa5qp9sUOY?version=3">
<param name="allowFullScreen" value="true">
<param name="allowscriptaccess" value="always">
<embed src="http://www.youtube.com/v/rBa5qp9sUOY?version=3" type="application/x-shockwave-flash" width="100%" height="61%" allowscriptaccess="always" allowfullscreen="true">
</object>
</p>
Итак, изначально это видео было размером 500 на 306 пикселей при встраивании его с YouTube.
Проблема в том, что эта штука может на самом деле работать, но я не знаю, к чему относятся проценты. Где 100% по ширине совершенно правильно и зависит от моего макета 61% по высоте не правильно. 61% - это правильное число, но выглядит неправильно, потому что это, вероятно, 61% какого-то внешнего контейнера или чего-то еще.
Любая идея, как я мог решить эту проблему. Я просто хочу, чтобы мои видео содержали на 100% (что сейчас правильно - даже при изменении размера) и пропорциональную высоту в зависимости от исходных значений видео?