响应式Flash视频,仅调整包装div的大小

时间:2015-09-02 11:26:35

标签: html css flash responsive-design

我已经阅读了一些关于Flash视频中的响应度的文章(<object> - 标签)但是当我尝试它时,视频没有调整大小但是视频的一半丢失了。 object标签的宽度和高度为100%,但只调整包装div的大小,而不是内容。

<div class="video row">
<object id="flash" class="video-flash" type="application/x-shockwave-flash" data="http://{$domain->data.domainname}/images/player_flv.swf" width="100%" height="100%">
<param name="movie" value="http://{$domain->data.domainname}/images/player_flv.swf" />
<param name="allowFullScreen" value="true" />
<param name="FlashVars" value="flv={$video}&amp;showfullscreen=1&amp;title={$title}&amp;autoload={if $autoload}1{else}0{/if}&amp;{if $autoplay}autoplay=1&amp;{/if}bgcolor=000000&amp;bgcolor1=430f26&amp;bgcolor2=200611&amp;playercolor=000000&amp;loadingcolor=ffffff&amp;buttoncolor=ffffff&amp;buttonovercolor=ffff00&amp;slidercolor1=430f26&amp;slidercolor2=200611&amp;sliderovercolor=ffff00&amp;showstop=1&amp;showvolume=1&amp;showtime=1{if $picture}&amp;startimage={$picture}{/if}"/>
</object>

和js:

window.onresize = function (event) {
    var width = window.innerWidth;
    if (width < 540) {
    $('.video').css({'width': '360px'});
    $('.video').css({'height': '180px'});
    }
    if (width < 480) {
    $('.video').css({'width': '280px'});
    $('.video').css({'height': '140px'});
    }
};

1 个答案:

答案 0 :(得分:0)

我通过刷新/重新加载视频内容解决了这个问题。

Enum