PDA

View Full Version : Problems centring a large swf


GFXboy
03-08-2010, 07:12 AM
Hi There,

I am in need of centring a swf that is larger than the browser window. I have found the following code that almost does the trick.

The only problem is that upon loading the page the file is not centred, you have to resize the browser for the swf to snap to the centre.

Is there a way that anyone can see that would centre the content immediately upon loading, or alternatively another set of code that work correctly?

Thank you for your time.

Best regards.

You can see a mock up swf with the following code implemented onto the page.
http://www.strivegfx.com/centre/


<style type="text/css">
<!--
#apDiv1 {
position:absolute;
width:1600px;
height:1200px;
z-index:1;
left: 0px;
top: 0px;
}
-->

<style type="text/css">
<!--
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
-->
</style></head>

<style type="text/css">
html, body {
height: 100%;
margin: 0; padding: 0;
}
html {
overflow: hidden;
}
</style>
</style>

<script language="JavaScript">
<!--
function returnObjById( id )
{
if (document.getElementById)
var returnVar = document.getElementById(id);
else if (document.all)
var returnVar = document.all[id];
else if (document.layers)
var returnVar = document.layers[id];
return returnVar;
}
function abscenter( id,idwidth ){
var winW = 1600;
if (parseInt(navigator.appVersion)>3) {
if (navigator.appName.indexOf("Microsoft")!=-1) {
winW = document.body.offsetWidth;
}else{
winW = window.innerWidth;
}
disone = returnObjById( id )
disone.style.left = ((winW/2)-(idwidth/2))+"px";
}
}
//-->

</script>

<body onResize="abscenter('apDiv1','1600');" onLoad="abscenter('apDiv1','1200')">

<div id="apDiv1" align="center">

<table border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td align="center" valign="top"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="1600" height="1200" title="payrollpluss_flash">
<param name="movie" value="centering_trial.swf" />
<param name="quality" value="high" />
<param name="wmode" value="transparent" />
<param name="SCALE" value="exactfit" />
<embed src="centering_trial.swf" width="1600" height="1200" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" wmode="transparent" scale="exactfit"></embed>
</object></td>
</tr>
</table>

</div>

Corrosive
03-08-2010, 10:50 AM
Yes, try this; http://www.dreamweaverclub.com/css-center-content.php

GFXboy
03-09-2010, 09:51 AM
Hi Corrosive (http://www.dreamweaverclub.com/forum/member.php?u=25422), thanks for the reply.

Unfortunately these examples seem to still fix the content to the left of the browser window when it becomes smaller than the swf itself.

This would usually be useful however with the flash I am creating the user will be dragging elements around the stage. I therefore need to have the swf centred at all times and very large, say 2500x2000px so that the elements never drop off the sides of the boarders.

Since this will be a large swf the div tag automatically locks the view point to the left hand side as the browser window is smaller than the swf dimensions.

I hope that makes sense.

Any light you could shed on achieving this would be great!

Thanks again.

Corrosive
03-09-2010, 10:13 AM
Ah right, OK. Bit beyond my capabilities and understanding of flash I'm afraid.

domedia
03-09-2010, 02:19 PM
This is not a flash issue, the question is how to center something that invokes the horizontal scrollbar. Maybe wait to invoke the JS until the page is completely loaded?