PDA

View Full Version : Javascript Positioning

Tussi
10-07-2004, 10:25 AM
Hi!

I have a problem. Not very good at javascript, but I've thought something out, which I think would work, if I only know how to do it...so:

I have a 800x600 swf file, and I would like to center it vertically and horizontal on the page. I've looked around, but it doesnt look possible to do, but since I know the size of it, wouldnt it be possible to calculate it sort of? I know you can position stuff anywere you want it with CSS, so if you found the height and width of the window, then you could calculate how far from the left and from the top the thing would have to be to be centered. Anyone following me? Is it possible? How would I do that? And would it be possible to keep it centered if the user resized the window after it was loaded?
coothead
10-07-2004, 10:59 AM
Hi there Tussi,

here is a working example of a dead-centered .swf...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>dead centered flash</title>

<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />

<base href="http://coothead.homestead.com/files/" />

<style type="text/css">
/*<![CDATA[*/

body {
background-color: #003;
margin: 0px
}

#horizon {
position: absolute;
top: 50%;
left: 0px;
width: 100%;
display: block
}

#content {
margin-left: -200px; /*half the swf width */
position: absolute;
top: -150px; /*half the swf height */
left: 50%;
width: 400px; /* swf width */
height: 300px; /* swf height */
}

#flash {
width:400px;
height:300px;
}


/*//]]>*/
</style>

</head>
<body>

<div id="horizon">
<div id="content">

<object id="flash"type="application/x-shockwave-flash" data="smiles.swf" >
<param name="movie" value="smiles.swf" />
</object>

</div>
</div>
</body>
</html>
Tussi
10-07-2004, 11:10 AM
wow! thanks a huge! Thats the first answer Ive seen that actually worked, and I think even understood:)

but small one thing:

whats this line? ->

/*<![CDATA[*/