1 person found this helpful
after the <body> tag add:
and just before the </body> tag add:
You could put your flash stuff in a <div> and center that to the browser window.
You can add a table to the generated HTML code.
Or, if the flash is the only thing on the page, you can change the width and height to 100%, to completely fill the screen. If you do this, go into the flash and add the script to keep it from scaling:
Stage.scaleMode = "noScale";
stage.scaleMode = StageScaleMode.NO_SCALE;
In AS2, you will also want to add:
Stage.align = "C";
to make sure it goes completely centered (or "T" if you want it centered at the top of the page)
AS3 automatically fully centers the swf.
If you do the 100% thing, then remember, everything will be visible that is sitting off the stage, so you will want to hide it somehow (with a mask, or a graphic)
1 person found this helpful
<html xmlns="http://www.w3.org/1999/xhtml"> <head> </head> <body> <div align="center"> flash goes here </div> </body> </html>
Hey thanks for your response kglad,
an elegant approach though this method seems to centrally align to the X axis only is there another command/funtion to make it align to the center on the Y axis also?
Hey thanks for your time Dan, a similar elegant approach as suggested above but again this code appears to centrally align on the X axis and not align to the center on the Y axis! Am I missing something
You could add a style to the div:
style="left: 50%; margin-left: -390px;
Where the -390px would represent half the width of your div itself
Ah, oh well! lol... I would have put in a table or a div tag, but when I open the html doc in Dreamweaver I have no visible repressentation of the Flash movie in the design view as I would have if I had created an html document from scratch and draged the movie onto the page, all I can see is the "get flash" hypertext and some other text. I did actually experiment by creating a div tag and dragged my movie into it but ended up with two movies one sitting on top of the other when I ran it in a browser lol. I'm quite intimdated by code and much prefer to work in the design view (wysiwyg and all that) which is quite restricting. Not really sure why the publish function in Flash does not sort this out in the first place? Anyway if I create a div tag in the design view then drag or cut/paste the "get flash" hypertext into it would that work? Thanks again
for horizontal centering is easy as you can see. vertical centering is not easy, as far as i know.
you might check the dreamweaver forum to see if there's something in dreamweaver that will vertically center your content.
<div style="width:300px;height:300px;left:50%;margin-left:-150px;top:50%;margin-top:-150px;bac kground-color:#CC0000;position:absolute;"></div>
Yay thanks Ross,
I thought initially that your methods sounded a little odd but hey they worked dude! You the man!!!
I have been exploring the use a of <div> to center my Flash movie in DM but I'm confused as to why you are using pixcels as a form of measurement as well as percentage in your suggested code? surely using pixcels would only center if you knew the size of the screen resolution of the end user. Thanks for your suggestions.
xchanins code explained:
<div style="width:300px;height:300px;left:50%;margin-left:-150px;top:50%;margin-top: -150px;background-color:#CC0000;position:absolute;"></div>
width:300px - the width of the div
height:300px - the height of the div
left:50% - moves the left side of the div to the middle of the page. This alone will leave the div appearing to be sitting a bit to the right, as the left side is at the center.
margin-left:-150px - this moves the left side half the width backwards, making the center of the div at the center of the page
top: 50% - this does the same for the top of the div that the left did for the left
margin-top:-150px - this does the same thing that margin-left did, but in the vertical
So, what is happening with the code is, the left and top get set to the center point of the page via a percent, and then are moved by half the width/height of the div to make the center-point the center of the page.