4 Replies Latest reply on Jun 10, 2009 12:05 PM by macsavers

    Fill browser - full screen

    DAVIDFON Level 1

      While playing with a project, I created an image I want to be the background and fill the browser with the swf centered. So the background image I could apply to the html file through css and it would fill the browser. However in catalyst, I am unable to set the background alpha to 0. It requires a color.

       

      So how would go about using a graphic for a background that fills the browser and center the rest of the content? Is this something I would need to finish off in flex? Whats the best practice? Thanks!

       

      David

        • 1. Re: Fill browser - full screen
          shamus oliver

          I did the same thing here's the code - just replace the image and the swf:

           

           

           

          <html xmlns="http://www.w3.org/1999/xhtml">
          <head>
          <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
          <title>Your title here</title>
          <style type="text/css">
          <!--
          #main {
               background-image: url(YourBackgroundImageHere.gif);
               background-repeat: no-repeat;
               background-position: center center;
          }
          body {
               margin-left: 0px;
               margin-top: 0px;
               margin-right: 0px;
               margin-bottom: 0px;
               background-color: #000;
          }
          -->
          </style>
          <script src="Scripts/swfobject_modified.js" type="text/javascript"></script>
          </head>
          
          <body>
          <table width="100%" height="100%" border="0" align="center" cellpadding="0" cellspacing="0">
            <tr>
          <td align="center" valign="middle" id="main"><object id="FlashID" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="960" height="500">
            <param name="movie" value="YourFancySWFHere.swf">
            <param name="quality" value="high">
            <param name="wmode" value="opaque">
            <param name="swfversion" value="6.0.65.0">
            <!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don’t want users to see the prompt. -->
            <param name="expressinstall" value="Scripts/expressInstall.swf">
            <!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
            <!--[if !IE]>-->
            <object type="application/x-shockwave-flash" data="fla/layoutCatalystC2/run-local/Main.swf" width="960" height="500">
              <!--<![endif]-->
              <param name="quality" value="high">
              <param name="wmode" value="opaque">
              <param name="swfversion" value="6.0.65.0">
              <param name="expressinstall" value="Scripts/expressInstall.swf">
              <!-- The browser displays the following alternative content for users with Flash Player 6.0 and older. -->
              <div>
                <h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
                <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" /></a></p>
              </div>
              <!--[if !IE]>-->
            </object>
            <!--<![endif]-->
          </object></td>
          </tr>
          </table>
          <script type="text/javascript">
          <!--
          swfobject.registerObject("FlashID");
          //-->
          </script>
          </body>
          </html>

          • 2. Re: Fill browser - full screen
            DAVIDFON Level 1

            Thanks. I got that part straight however - I cant get the background of the main swf to be transparent in flash catalyst. Under set Artboard Size and color - it doesnt offer the slash option for transparent.

             

            So while I can get the background CSS set up - the flash artboard color still shows so I have a square on the background which isnt what I want.

             

            Thanks

            • 3. Re: Fill browser - full screen
              njadobe2 Adobe Employee

              Hi--unfortunately, there's no way to set the background of the SWF to be transparent in the beta of FC. I'll make sure this is captured on our list of requested features, though.

               

              Thanks,

               

              nj

              • 4. Re: Fill browser - full screen
                macsavers Level 1

                Changing the wmode to transparent on the HTML page doesn't work?