Raptorze,

[quoted text, click to view]

Okay. :)

[quoted text, click to view]

I guess you're embedding it with pixel-based width and height, instead
of percentage-based.

[quoted text, click to view]

So here's a <div> whose position is absolute, set to 664 pixels in from
the left and 336 pixels down from the top. This <div> will therefore always
be 664 in and 336 down. Please understand, this might happen to look
centered if your browser is maximized and your resolution is set to
1024x768, but if you change either of these, the <div> may no longer appear
centered, even though it's still 664 in and 336 down. By the way, that's
664 in and 336 down from the browser's upper lefthand corner.

[quoted text, click to view]

Here, you're explicitly setting your SWF's width and height to 400 by
320. There is no "breathing" going on: the SWF will always be 400x320,
because that's how you've set its width and height.

[quoted text, click to view]

Same here. The <object> tag is for IE; the <embed> tag is for all the
other browsers.

[quoted text, click to view]

Is it changing? Honestly?

[quoted text, click to view]

Well, that would make sense. You set your <div> to appear at 664 pixels
in from the left. At a resolution of 800x600, your screen is only 800
pixels wide. That leaves your SWF only 136 pixels to squeeze itself in
place -- and yet your SWF is set to 400 pixels wide. No wonder it doesn't
fit!

If you pay careful attention, you'll notice that the SWF stays exactly
the same size as before, even if it appears bigger: it stays the same *in
proportion* to other items on the page. When you change your resolution
from high(er) to low(er), you'll notice that *everything* appears bigger.
Everything. The reason for this is because your monitor is only showing 800
pixels across, rather than 1024 (or even more).

[quoted text, click to view]

Well, you're already doing it. I think what you're really saying is
that you want your SWF to actually *change* size and position. You want it
to shrink in cases where the resolution is lower and/or grow when resolution
is higher, to compensate.

There are a number of ways to handle this. You might, for example, use
percentages instead of pixel values for the width and height attributes of
your <object> and <embed> tags. 100% width and 100% height is what it says,
after all. Of course, going this route means you'll have to consider that
some people will maximize their browsers and some wont. For people who keep
their browsers un-maximized, the SWF will still be 100% the width and height
of the browser, even if they purposefully size the browser down to one
quarter of their full screen size.

It can get as complicated as you want. You could employ JavaScript to
measure the user's screen size in pixels, then use JavaScript again to set
the width and heigth attributes of your <object>/<embed> tags accordingly.
You could forego JavaScript and do it all "in house," as it were, using
ActionScript to measure the width of the Stage itself and resize the SWF in
question accordingly. To do it this way, you would have to make use of the
Stage.onResize event handler and follow the guidelines ni the article here
....

http://www.moock.org/blog/archives/000021.html

Be aware that, depending on your HTML document's doctype, Mozilla
browsers may not display a percentage-based width and height as expected.
To remedy this, either drop the doctype (at your own risk -- search
alistapart.com to see the benefits of doctypes) or add the following CSS to
your document:

<style>
html, body { width: 100%; }
</style>


David
stiller (at) quip (dot) net
"Luck is the residue of good design."

I just don't get it....

I'd like simply to make the swf file load in a website - the same size - no
matter the resolution, and stay put (even if you scroll up and if you shrink
the browser window) and if i look at it on John or Suzie's laptop - at least
maintains it size and position :)

I have a swf file loading the div layer of a page... at 1280x1024 its
wonderful...
at anything less - it's huge and not where I had it...


Here is the DIV LAYER code:

---------------------------------------------------------------

<div id="Layer1" style="position:absolute; width:200px;
height:115px; z-index:1; left: 664px; top: 336px;">

<object
classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"
codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#
version=6,0,0,0" width="400" height="320" id="billboard_barnesX" align="middle">

<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="billboard_barnesX.swf" />
<param name="quality" value="best" />
<param name="wmode" value="transparent" />
<param name="bgcolor" value="#ffffff" />
<embed src="billboard_barnesX.swf" quality="best"
wmode="transparent" bgcolor="#ffffff" width="400" height="320"
name="billboard_barnesX" align="middle" allowscriptaccess="sameDomain"
type="application/x-shockwave-flash"
pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
</div>


---------------------------------------------------------------

I just want the thing to stay put and stay the same size... Ugh!

On an 800x600 resolution ---> it's enormous - like a GIANT NIGHTMARE!! and
off the screen completely...


There should be a standard setting on publish settings for any movie...

Keep a certain size and maintain position no matter!

anyone?

So I change the two height and widths to 100% (object and embed)
and keep the DIV tag to left: 664px; top: 336px; ???

THEN: the movie still stays locked when I mess with the browser window...

if I scroll up and down its stays - (obviously with 336 from top) - GOOD

but if i shrink browser - it stays at the 664 in and disappears...

I'm trying to make that move with the browser window adjustments....


the DIV layer locks it there no matter - 664 in and 336 from top


which makes me say UGH! -> move accordingly - don't disappear!!!

I appreciate youe Help!

Any ideas?

Raptorze,

[quoted text, click to view]

You have a <div> whose width and height are set to 200 by 115, per your
notes from last time ...

[quoted text, click to view]

.... and your SWF is inside this <div>. The SWF is now set to 100% width and
100% height. So let's consider the implications: the SWF is *inside* the
<div>, so I would expect the SWF to fill its container by 100%, which is to
say I would expect the SWF to be appear at 200x115.

Why is your SWF inside a <div> in the first place? I'm not saying it's
right or wrong to wrap SWFs (or anything else) in a <div>, but the point is,
you've chosen to put your SWF into an absolutely positioned, hard-sized
container.

[quoted text, click to view]

That's to be expected, right? It's inside a <div> whose position has
been set to 336.

[quoted text, click to view]

It stays at 664 because that's where you've put it. ;) Either use
percentages as the width and height of your <div>, or dump the <div>
altogther.

[quoted text, click to view]

Pixel values are pixel values. They don't change. If you set your
<div>'s width and height as percentages, the <div> will resize with your
browser ... and consequently, your SWF will resize with your <div>. It all
makes sense in that light, doesn't it?

[quoted text, click to view]

Yes. I can only conclude this is what you want, since you coded the
<div> that way.

[quoted text, click to view]

It's not disappearing at all. The SWF is a certain width: it takes up
mass, so to speak. You've shoved it way out to 664 pixels. If the browser
is narrower than 664 pixels, what else is the SWF supposed to do? It must
obey the construct of its container.

[quoted text, click to view]

Figure out how you want your HTML structure to be, and put yoyr SWF
inside that structure -- <div> or no <div>. You can use CSS to absolutely
position almost any HTML tag; it doesn't have to be a <div>. Heck, you
could absolutely position your <object> and <embed> tags. You could use
relative positioning.

This isn't any different from positioning a JPG or a paragraph of text,
honestly. :) It sounds like you want to either center your content
horizontally and vertically, or make your SWF the size of the browser's view
port, in which case you don't need to center it (or position it) at all,
since it will fill the whole container.

Horizontal centering in HTML/CSS is pretty straightforward. If the
<div> is smaller than the browser's view port, set margin: auto on the left
and right sides with CSS. Or place your content into a <div> and use
text-align: center for the <div>. Vertical centering is a bit harder ...
just Google "CSS vertical centering" to find some tutorials.


David
stiller (at) quip (dot) net
"Luck is the residue of good design."