(21 votes, average: 4.29 out of 5)An easy tutorial on how to create 100% full screen Flash site using actionscript and html.
How to create a 100% full screen flash sites. This has become very popular with flash site. Just take a look at the favoritewebsiteawards.com site just to see how great they look at full screen. So let’s get started. In flash for example “bg” is the name of our gradation background movie clip (mc) and “link_mc” will be the name of our button movie clip.
1) We will need to set the anchor point to the top left using the code “Stage.align = “TL”.
2) Then set no scale because we do not want to distort our web site when the window resizes.
3) We will add a listener so every time the stage changes size, we resize the background and reposition the “link_mc”. Inside the listener we call our custom functionto named resizeBg(). We all so call this function at the very last line of code to initiate the function on the intro of the flash to set everything to the current stage size.
Copy and paste the code below in to your flash file.
Stage.align = “TL”;
Stage.scaleMode = “noScale”;
sizeListener = new Object();
sizeListener.onResize = function() {
resizeBg();
};
Stage.addListener(sizeListener);
function resizeBg() {
link_mc._x = Stage.width/2;
link_mc._y = Stage.height/2;
bg._x = 0;
bg._y = 0;
bg._width = Stage.width;
bg._height = Stage.height;
}
resizeBg();
Now on to the HTML:
1) Using CSS (casketing style sheet) we need to set the gutter spaces (padding, margin) to zero. This will remove the gaps around the flash in the window. Also set to the height to 100%.
2) In the flash object & embed tags set both width and height to 100%.
That’s it. You can copy and paste the code below in to your html but remember to rename the .swf file to your flash .swf file name.
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml” xml:lang=”en” lang=”en”><head>
<meta http-equiv=”Content-Type” content=”text/html; charset=iso-8859-1″>
<title>By Alex McLean – Full Screen Flash</title>
<style type=”text/css”>
html, body {
height: 100%;
margin: 0;
padding: 0;
}
</style></head>
<body bgcolor=”#ffffff”>
<object classid=”clsid:d27cdb6e-ae6d-11cf-96b8-444553540000″ codebase=”http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0″ id=”cool” align=”middle” height=”100%” width=”100%”>
<param name=”allowScriptAccess” value=”sameDomain”>
<param name=”movie” value=”index_fullscreen.swf”>
<param name=”quality” value=”high”>
<param name=”bgcolor” value=”#ffffff”>
<embed src=”index_fullscreen.swf” quality=”high” bgcolor=”#ffffff” name=”index_fullscreen.swf” allowscriptaccess=”sameDomain” type=”application/x-shockwave-flash” pluginspage=”http://www.macromedia.com/go/getflashplayer” align=”middle” height=”100%” width=”100%”></object>
</body></html>
Loading ...
thanks much
It’s actually a nice and useful piece of information. I am happy that you shared this useful info with us. Please keep us up to date like this. Thanks for sharing.
Excellent weblog here! Also your website loads up fast! What host are you the use of? Can I am getting your affiliate hyperlink for your host? I wish my website loaded up as quickly as yours lol