javascript - 動的に読み込まれる MediaElementjs ビデオのサイズを変更する

Question

だから私は、jQuery の .load() を使用してページにロードするビデオを持っています。「ビデオ」セクションで問題を確認できる Web サイトは次のとおりです: http://guillaumep.com/。

使用するビデオタグは次のとおりです。

<video><source src="URLTOVIDEO.mp4" type="video/mp4" />

my にロードされた直後にビデオ HTML を生成するコードを次に示します#contentFrame。

$('video').wrap('<div class="videowrapper">')

.attr({ 'style': 'width: 100%; height: 100%;' })
.mediaelementplayer({ success: function (player) { 
    correctVideoSize($(player).parent(4).eq(0)); }
});

次に、ウィンドウの形状に応じてビデオ プレーヤーのサイズを実際に変更するコードを用意しました。これにより、ビデオは常に最大サイズで表示され、ウィンドウがオーバーフローすることはありません。

function correctVideoSize(videoContainer) {
    var videoContainerHeight = $(window).height() - 100;
    var videoContainerWidth = $(window).width() * 0.92;
    var videoContainerRatio = videoContainerWidth / videoContainerHeight;
    var videoRatio = videoContainer.width() / videoContainer.height();
    console.log('videoRatio : ' + videoRatio);
    console.log('videoContainerRatio : ' + videoContainerRatio);

    if (!isNaN(videoRatio) && videoContainerRatio < videoRatio)
    {
        videoContainer.height(videoContainerWidth / videoRatio).width(videoContainerWidth);
    }
    else if (!isNaN(videoRatio))
    {
        videoContainer.height(videoContainerHeight).width(videoContainerHeight * videoRatio);
    }

    return videoContainer;
}

http://guillaumep.comでわかるように、画像のサイズ変更は絶対に機能しますが、ビデオの場合、いつ、何を、どこでサイズ変更する必要があるのか​​ わかりません。ここで問題を確認できます: http://guillaumep.com/2012/10/22/test-video/ .

私はさまざまなことを試し、$(window).resize() イベントでビデオのサイズを正しく変更しましたが、MediaElementJs が既にこのイベントにフックされ、いくつかの魔法を行っているためだと思います。

私はここで本当に迷っています。助けてくれてありがとう！