Search code examples
javascripthtmlflashswfobject

Resize an SWF when loading it with SWFObject


I'm loading an SWF movie into an HTML page using SWFObject. I want to resize this SWF dynamically. How can SWFObject help? I'm sure I don't have to write my own solution.


Solution

  • The easiest solution is to embed the SWF within a container div, then use JavaScript and CSS to dynamically resize the container DIV. If the SWF is set to 100% width/height, it will stretch to fit the wrapper whenever the wrapper is resized.

    In the body:

    <div id="wrapper">
    <div id="flash">This div will be replaced by an object via SWFObject</div>
    </div>
    

    In the head:

    <script>
    var flashvars = {};
    var params = { scale: "exactFit" };
    var attributes = {};
    
    swfobject.embedSWF("myContent.swf", "flash", "100%", "100%", "9.0.0","expressInstall.swf", flashvars, params, attributes);
    </script>
    
    <style type="text/css">
    #flash {
       display: block;
       width: 100%;
       height: 100%;
    }
    </style>
    

    Now whenever you resize #wrapper, the SWF will scale to fill it.