Layers doesnt move with the page

**nedmex** · 05-17-2006 06:15 PM

Hi

I am creating a page with submenu, but the problem is when I center the the table, the layer doesn’t move with the page. How do i fix this? I am getting crazy from trying.

I hope somebody can help me with this? I am not really a fan of layers, but I don’t have a choice.

Regards,

Edwin Giliams

Australia

Here is the code: <HTML><HEAD><TITLE>123 Flash Menu By Dreamingsoft </TITLE>
<script type="text/javascript" src="flashobject.js"></script><script type="text/javascript" src="flashfloat.js"></script>
<style type="text/css">

</style>
</HEAD>
<BODY bgcolor="#3399FF" marginwidth="0" marginheight="0" leftmargin="0" topmargin="5">
<center><br>
<div STYLE="POSITION: ABSOLUTE; LEFT:35px; TOP:4px; Z-INDEX:350" id="floater" >This text is replaced by the Flash movie.</div>
<script type="text/javascript">
var fo = new FlashObject("Template.ita.swf", "floater", "529", "172", "6", "#FFFFFF");
fo.addParam("menu","false");
fo.addParam("quality","best");
fo.addParam("salign","LT");
fo.addParam("scale","noscale");
fo.addParam("wmode", "transparent");
fo.write("floater");
</script></center>
<div align="center">
<table width="949" border="0" cellpadding="0" cellspacing="0">

<tr>
<td width="949" height="455" bordercolor="#FF0000" bgcolor="#FF0000"><span class="style1"></span></td>
</tr>
</table>
</div>
</BODY></HTML>

**phpnovice** · 05-19-2006 05:56 PM

You need to set the absolute position of the layer according to the relative position of the HTML element for which the layer should correspond. You can obtain the relative position of the HTML element as follows:

Code:

function getRelativePosition(id) {
  var obj = document.getElementById(id);	// calculate object position
  var x = obj.offsetLeft;
  var y = obj.offsetTop;
  while (obj = obj.offsetParent) {		// based on all parent nodes
    x += obj.offsetLeft;
    y += obj.offsetTop;
  }
  return [x, y];
}

You can set the absolute position of the layer as follows:

Code:

var layer = document.getElementById("floater");
var coords = getRelativePosition("myid");
layer.style.left = coords[0] + k_left + "px";
layer.style.top = coords[1] + k_top + "px";

As shown, some constant (k) amount of final adjustments may be added into this positioning equation, too.

**nedmex** · 05-20-2006 01:56 AM

Thanks for your help, but can you tell me where to put this an what to change. I am more a designer than a programmer.

Thanks for your help

Edwin Giliams

This is my code: <HTML><HEAD><TITLE>123 Flash Menu By Dreamingsoft </TITLE>
<script type="text/javascript" src="flashobject.js"></script><script type="text/javascript" src="flashfloat.js"></script></HEAD>
<BODY bgcolor="#3399FF">
<center><br>
<div STYLE="POSITION: ABSOLUTE; LEFT:451px; TOP:0px; Z-INDEX:0" id="floater" >This text is replaced by the Flash movie.</div>
<script type="text/javascript">
var fo = new FlashObject("template oke.swf", "floater", "529", "172", "6", "#FFFFFF");
fo.addParam("menu","false");
fo.addParam("quality","best");
fo.addParam("salign","LT");
fo.addParam("scale","noscale");
fo.addParam("wmode", "transparent");
fo.write("floater");
</script></center></BODY></HTML>

Thread: Layers doesnt move with the page

Thread Tools

Display

Layers doesnt move with the page

Help

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions