親コンテナのサイズを変更したときのビデオのサイズ変更

Question

親divのサイズを変更しているときにビデオのサイズを変更するにはどうすればよいですか？

<div id="resizable" class="resizable" style="width:640px; height:390px; border:solid gray 1px" class="ui-widget-content"> 
    <object class="video" style="height: 390px; width: 640px;"> 
     <param name="movie" value="http://www.youtube.com/v/u1zgFlCw8Aw?version=3"> 
     <param name="allowFullScreen" value="true"> 
     <param name="allowScriptAccess" value="always"> 
     <embed class="video" src="http://www.youtube.com/v/u1zgFlCw8Aw?version=3" type="application/x-shockwave-flash" allowfullscreen="true" allowScriptAccess="always" width="640" height="390"> 
    </object>   
</div> 

$("#resizable").resizable(); 

http://deadwoodfilms.com/jquery/gallery/video.html

Answer 1

それの世話をするそこにjQueryプラグインと呼ばれるFitVidsがあります：

サイト：http://fitvidsjs.com/

githubの：https://github.com/davatron5000/FitVids.js

Answer 2

ちょうど子要素の高さを設定幅は100％になります。

<object class="video" style="height: 100%; width: 100%;">