Forum Moderators: open

Message Too Old, No Replies

Flash 100 percent height problem, scales movie proportionately

BUT the background and the space it takes up always equals window height!

         

whoisgregg

4:29 am on Nov 22, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Hello! Trying to solve this, but can't seem to get it... I have a two column fluid css layout with a large left content area (70% width) and a right sidebar column (28% width). The left content area contains a flash movie that is 800px wide by 500px wide.

Of course, I don't want it to be that size, so I set it's width and height as 100% and scale to default (so it scales proportionately.) Problem is, the 100% setting for the height of the movie is actually calculated to equal the height of the browser window while the width is set to the equal the width of the parent element (the left column in my case). Then the movie scales itself to fit the smallest number and slides to the center of the entire space.

So -- since the movie is in "landscape" or "wide" proportions, if the users window is in "portrait" or "tall" proportions, the net effect is that the flash movie gets pushed down the page with a huge margin between the top of it's column and the start of the movie.

How do I keep the flash movie as large as it can be and keep it aligned to the top of it's container? Also, how do I keep it's container from being so much taller than it needs to be?

The problem in ASCII art:

¦-heading------¦-nav--¦ 
¦              ¦      ¦
¦              ¦      ¦
¦              ¦      ¦
¦¦----flash---¦¦      ¦
¦¦            ¦¦      ¦
¦¦            ¦¦      ¦
¦¦            ¦¦      ¦
¦¦--endflash--¦¦      ¦
¦              ¦      ¦
¦              ¦      ¦
¦              ¦      ¦
¦ text         ¦      ¦

whoisgregg

4:41 am on Nov 22, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Okay, I've solved one half of my problem. I can add a salign attribute to the object and it will put the movie at the top. However, it still has an enormous amount of "extra" space below the movie:

Any suggestions on how to remove this extra space?

Current status in ASCII art:

¦-heading------¦-nav--¦ 
¦¦----flash---¦¦      ¦
¦¦            ¦¦      ¦
¦¦            ¦¦      ¦
¦¦            ¦¦      ¦
¦¦--endflash--¦¦      ¦
¦              ¦      ¦
¦              ¦      ¦
¦              ¦      ¦
¦              ¦      ¦
¦              ¦      ¦
¦              ¦      ¦
¦ text         ¦      ¦

whoisgregg

2:01 am on Nov 23, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



I'm thinking it might be possible to use a javascript and css to reposition the text following the movie to "slide" into place below the movie, other than that I am completely stumped. :( :(