Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Aug 2005
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Javascript for page layout

    Hi, I am CSS and Javascript newbie and currently trying to build a website where I want the footer to start where ever the longest column ends.

    Can someone please have a look at the following script and let me know, where I am going wrong and if I need to insert this in my template, in my CSS sheet or in each individual page, as my footer who is on "hidden" in my CSS style sheet, does not appear, when I load the index page!

    // JavaScript Document
    <skript type="text-javascript">
    function adjustLayout()
    {
    // Ermittle die tatsaechlichen Hoehenwerte
    var cHeight = xHeight ("main_content");
    var cHeight = lHeight ("infofield_content");

    //Ermittle den groessten Hoehenwert
    var maxHeight = Math.max(cHeight, Math.max(lHeight));

    // Weise den groessten Hoehenwert allen Spalten zu
    xHeight("main", maxHeight);
    xHeight("infofield", maxHeight);

    // Zeige die Fusszeile and
    xShow("border_low");
    xShow("footer");
    }

    window.onload = function ()
    {
    xAddEventListener(window, "resize", adjustLayout, false);
    }
    </skript>

    Thank you so much for your help!

    Onika

  • #2
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,534
    Thanks
    3
    Thanked 512 Times in 499 Posts
    Just a thought

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    
    <head>
      <title></title>
    <script language="JavaScript" type="text/javascript">
    /*<![CDATA[*/
    
    function Footer(){
     if(document.all){
      eles=document.all;
     }
     else {
      eles=document.getElementsByTagName('BODY')[0].getElementsByTagName('*');
     }
     ftobj=document.getElementById('fred');
     ft=0;
     for (i=0;i<eles.length;i++){
      if (eles[i].offsetTop){
      if (eles[i].offsetTop+eles[i].offsetHeight>ft){
       ft=eles[i].offsetTop+eles[i].offsetHeight
      }
      }
     }
     ftobj.style.top=(ft+10)+'px';
    
    }
    /*]]>*/
    </script></head>
    
    <body onload="Footer();">
    <div style="position:absolute;top:20px;left:20px;width:200px;height:200px;background-color:red;" ></div>
    <div style="position:absolute;top:20px;left:320px;width:200px;height:350px;background-color:blue;" ></div>
    <div id="fred"  style="position:absolute;top:20px;left:0px;width:400px;height:100px;background-color:yellow;" ></div>
    </body>
    
    </html>


  •  

    Posting Permissions

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