As I discussed in my introduction article, Full Browser Flash (FBF) has recently become a large trend in Flash based site design. Its many benefits include seamless background and content integration as well as an unrestricted movie size compared with fixed stage sizes. So now that you know it's trendy and beneficial let's discuss how you can employ this technique.
Developing a FBF formatted site is relatively easy. I would say that this technique, outside of copying and pasting the following code, requires a minimal knowledge of ActionScripting.
The first thing you need to do in the HTML for you project is set the width and height parameters to use 100% scaling. We set our SWF size to be a percentage of the window vs. a pixel width allowing the resize in the window. This option has been around since the early, early days of Flash. Do the following within your object and embed tags:
This is the basic method for filling your browser window. You'll also notice the SWF is aligned to the top left. Our 0,0 coordinate for our SWF will be the top left just like in the Flash authoring environment. You'll also want to set the margin for the window to 0 in your body tag or CSS style sheet. This will insure there is no space between the SWF and browser chrome (outer window elements) when presented in the window.
Next up is setting the Flash movie to not allow scaling. As we have the HTML set now, your content will be stretched to fit the browser window regardless of its proportion or size. This will result in unwanted distortion of the SWF. To counter this, within the SWF, place the following ActionScript in your first frame:
This sets the Stage object's scale mode property to not allow scaling.
That's it! Pretty easy right? Now you can develop as you would and know that your stage can be as tall and wide as you user wants. In the next article we'll talk about setting up listeners to allow your content to react to the user resizing the browser window.