www.webdeveloper.com
Results 1 to 3 of 3

Thread: Layers doesnt move with the page

  1. #1
    Join Date
    May 2006
    Posts
    2

    Unhappy Layers doesnt move with the page

    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">
    <!--
    .style1 {color: #FF0000}
    -->
    </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">
    <!--DWLayoutTable-->
    <tr>
    <td width="949" height="455" bordercolor="#FF0000" bgcolor="#FF0000"><span class="style1"></span></td>
    </tr>
    </table>
    </div>
    </BODY></HTML>

  2. #2
    Join Date
    Dec 2004
    Posts
    8,637
    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.

  3. #3
    Join Date
    May 2006
    Posts
    2

    Help

    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 Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles