SOLVED: CMSMS full-browser flash impossible? (no, very easy, actually!)
Posted: Fri Jun 20, 2008 3:56 pm
This is something which needs to be fixed. If I am wrong, please tell me, but make sure you try to do it first.
If you follow the details below using CMSMS, you will not be able to fill the browser with your Flash movie. It might fill 100% height, but that is not the same as filling the entire window.
From SWFObject FAQ: http://code.google.com/p/swfobject/wiki/faq
1. How can I create a SWF that will encompass 100% of the browser window?
The following technique is also known as Full Browser Flash:
1. Set both the width and height of your SWF to 100% in your SWFObject definition
2. Include CSS to get rid of any default margins/padding and set the height of the html element, the body element and the entire chain of block level HTML elements that your SWF will be nested in to 100%, because Firefox (or: any Gecko based browser) in standards compliant mode (or: using a valid DOCTYPE) interprets percentages in a very strict way (to be precise: the percentage of the height of its parent container, which has to be set explicitly):
html, body, #containerA, #containerB { height:100%; }
body { margin:0; padding:0; overflow:hidden; }
3. Manage the scaling and alignment of your SWF and the positioning of your SWF's elements, within your ActionScript code, e.g.:
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;
stage.addEventListener(Event.RESIZE, resizeHandler);
function resizeHandler(event:Event):void {
// center stuff
}
NOTE: For positioning elements always define a resize handler, because a user can resize the browser window and in Internet Explorer (using the dynamic publishing method) the stage size is only available on first load. When reloading or revisiting a page it will initially be 0, causing the Flash player to keep on triggering the stage.resize event until it receives its current value
Three code examples can be found in the SWFObject test suite:
* Static publishing: [ http://www.swffix.org/swfobject/testsui ... flash.html ]
* Dynamic publishing: [ http://www.swffix.org/swfobject/testsui ... flash.html ]
* Dynamic publishing including min-width, min-height and scrollbars: [ http://www.swffix.org/swfobject/testsui ... h_adv.html ]
If you follow the details below using CMSMS, you will not be able to fill the browser with your Flash movie. It might fill 100% height, but that is not the same as filling the entire window.
From SWFObject FAQ: http://code.google.com/p/swfobject/wiki/faq
1. How can I create a SWF that will encompass 100% of the browser window?
The following technique is also known as Full Browser Flash:
1. Set both the width and height of your SWF to 100% in your SWFObject definition
2. Include CSS to get rid of any default margins/padding and set the height of the html element, the body element and the entire chain of block level HTML elements that your SWF will be nested in to 100%, because Firefox (or: any Gecko based browser) in standards compliant mode (or: using a valid DOCTYPE) interprets percentages in a very strict way (to be precise: the percentage of the height of its parent container, which has to be set explicitly):
html, body, #containerA, #containerB { height:100%; }
body { margin:0; padding:0; overflow:hidden; }
3. Manage the scaling and alignment of your SWF and the positioning of your SWF's elements, within your ActionScript code, e.g.:
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;
stage.addEventListener(Event.RESIZE, resizeHandler);
function resizeHandler(event:Event):void {
// center stuff
}
NOTE: For positioning elements always define a resize handler, because a user can resize the browser window and in Internet Explorer (using the dynamic publishing method) the stage size is only available on first load. When reloading or revisiting a page it will initially be 0, causing the Flash player to keep on triggering the stage.resize event until it receives its current value
Three code examples can be found in the SWFObject test suite:
* Static publishing: [ http://www.swffix.org/swfobject/testsui ... flash.html ]
* Dynamic publishing: [ http://www.swffix.org/swfobject/testsui ... flash.html ]
* Dynamic publishing including min-width, min-height and scrollbars: [ http://www.swffix.org/swfobject/testsui ... h_adv.html ]