Aligning Flash swf into a webpage

**J. C. Denton** · Sep 28 '05, 11:45 AM

Re: Aligning Flash swf into a webpage

dnc28 å†™é“:[color=blue]
> Hi!
>
> Have a look at these sites.
>
> http://www.untitledstudio.com/flash.htm
>
> http://www.uniform.net/index2.html
>
> Both these sites have a Flash .swf file embedded into a HTML webpage.
>
> I want to achieve the same thing for my website. I have previously just
> used Flash but this by default places the movie in the top right corner
> of the web browser page. I know you can change this before publishing
> in Flash, but there aren't many options, and excludes the option I want
> to achieve.
>
> I want to be able to align my Flash movie so that it is centred
> vertically, and centred horizontally. The Flash movie is 760 x 550
> pixels. Is it possible for someone to create the file for me so I can
> drop in my Flash movie? Can I do this using Dreamweaver? Or any other
> method? Any written advice would also be great!
>
> Any ideas?
>
>[/color]

Someone here might do it for 10 bucks.

--
Consultants for hire

Domain im Kundenauftrag registriert

http://www.rent-a-pro.com/

Domain registriert bei united-domains.de

**zoe** · Sep 28 '05, 04:07 PM

Aligning Flash swf into a webpage

First ... you need to change the HTML settings when publishing your movie. Set your Dimensions to '100 by 100 percent'. HTML alignment is 'Default' and your Scale is 'No Scale'. Make sure to leave Flash alignment to 'Center Center'.

Next ... after publishing your movie open your HTML in a text editor. I will tailor the code to what you need and explain it for you ...

In between your <head> </head> tags you will want to place this snippit of code....

<style type="text/css">
#horizon {
color: white;
background-color: transparent;
text-align: center;
position: absolute;
top: 50%;
left: 0px;
width: 100%;
height: 1px;
overflow: visible;
visibility: visible;
display: block}

div.container {
background-color: transparent;
text-align: center;
margin-top: -275px;
margin-left: -380px;
position: absolute;
top: 50%;
left: 50%;
width: 760px;
height: 550px;
visibility: visible}

</style>

now.... right after your body tag insert these two div tags

<div id="horizon">
<div class="containe r">

</div>
</div>

The explanation ...
The 'div container' style ... margin-top is half of your height and margin-left is half of your width. I have done this with my own site and it worked perfectly in both Mozilla and IE.

I hope this helps you!! :)

Aligning Flash swf into a webpage

Aligning Flash swf into a webpage

Comment

Comment