10

たとえば、YouTubeビデオを埋め込む場合

<iframe width="560" src="http://www.youtube.com/embed/25LBTSUEU0A" class="player" frameborder="0" allowfullscreen></iframe>

jQueryを使用して、アスペクト比が16：9の高さを設定するので、幅が560の場合、高さは315pxになります。
私は高さを設定するためにこのjqueryを持っていますが、16：9の比率を適用する方法がわかりません

$('.player').parent().attr('width', ':9ratio');

または、これはcssを使用してきれいに行うことができますか？

4

5 に答える 5

24

アスペクト比は幅：高さです。したがって、既知の幅に基づいて高さを計算したい場合は、非常に簡単です。

//width=560, wanted height is 315
$('.player').parent().attr('height', 560*9/16);
于 2011-11-04T19:06:59.527 に答える
5

これには、jQuery の代わりに css calc を使用することをお勧めします。

width: 560px;
height: calc(560px * 9/16);
于 2015-12-21T16:05:26.970 に答える
0 
$('.player').parent().attr('width', 560*9/16)
于 2011-11-04T19:04:36.723 に答える