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

Posted 2023-02-16

【中文标题】响应式 Flash 视频，调整大小仅包装 div

【英文标题】：Responsive flash video, resized only wrapping div

【发布时间】：2015-11-27 21:15:30

【问题描述】：

我已经阅读了一些关于 Flash 视频响应性的文章 (<object>-tag)，但是当我尝试它时，视频没有调整大小，但视频的一半丢失了。对象标签的宽度和高度为 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"  >
<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 $autoload1else0/if&amp;if $autoplayautoplay=1&amp;/ifbgcolor=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=1if $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');
    
;

【问题讨论】：

看来你的flash不接受调整大小

你能分享链接/演示，我们可以检查这个问题吗？

这是一个夜总会的网站，你可以在那里查看：sweetparadise.cz/cs/video

【参考方案1】：

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

    function refreshDialer() 
    //alert("In function");
    if (document.getElementById("flash")) 
    var container = document.getElementById("flash");

    var content = container.innerhtml;
    //alert(content);
    container.innerHTML = content;
    


window.onresize = function (event) 
    var width = window.innerWidth;
    if (width < 630) 
    $('iframe').css('width': '400px');
    $('iframe').css('height': '220px');
    
    if (width > 630) 
    $('iframe').css('width': '480px');
    $('iframe').css('height': '360px');

    $('.video').css('width': '480px');
    $('.video').css('height': '360px');
    refreshDialer();

    
    if (width < 540) 
    $('.video').css('width': '360px');
    $('.video').css('height': '180px');

    $('iframe').css('width': '360px');
    $('iframe').css('height': '180px');
    refreshDialer();
    
    if (width < 480) 
    $('.video').css('width': '280px');
    $('.video').css('height': '140px');

    $('iframe').css('width': '280px');
    $('iframe').css('height': '140px');
    refreshDialer();
    
;