View Full Version : javascript to display footer at the bottom of the page

01-14-2004, 03:20 PM
My website is a framed page. Here is the code:

<frameset rows="*,27" framespacing="0" frameborder="0" border="0">
<frame src="home.html" name="home" scrolling="yes" noresize>
<frame src="footer.html" name="footer" scrolling="no" noresize>

<script type="text/javascript" language="JavaScript" src="js/stylesheet.js"></script>
<body topmrgin="0" bottommargin="0" marginwidth="0" marginheight="0">
<table border="0" height="24" width="99%" cellspacing="0" cellpadding="0">
<tr><td bgcolor="#3173B5" valign="top" height="2" colspan="2"><img src="images/sp.gif" border="0" height="2"></td></tr>
<tr><td bgcolor="#3173B5" align="left" valign="top" height="16" >&#160; &#160; <a CLASS="SWhite" href="home.html"target="home"><b>Home</b></a> <a CLASS="SWhite">|</a> <a CLASS="SWhite" href="mailto: my@me.com"><b>E-mail</b></a> <a CLASS="SWhite">|</a>&#160; <a CLASS="SWhite" href="javascript: window.open('privacy.html','NewWindow','status=yes,resizable,scrollbars=1,width=600,height=450');voi d('');"><b>Privacy Policy</b></a> <a CLASS="SWhite">|</a> <a CLASS="SWhite" <a CLASS="SWhite" href="sitemap.html" target="home"><b>Sitemap</b></a></td><td CLASS="Blubg" align="right" valign="top"><a CLASS="SWhite">Copyright &copy; 2004 </a></td></tr>
<tr><td bgcolor="#3173B5" height="2" colspan="2"><img src="images/sp.gif" border="0" height="2"></td></tr>

As you can see, the bottom frame is very small. The reason I did like that is, the fotter.html is a small streak of blue background with some navigation links and the copyright will always stay at the bottom of the page.
In this way the bottom frame always stays at the bottom of the page no matter what resolution you use or browser you use. But now my boss ask me to take away the frames. So now I want to display the page without the frames. But at all times, I want the footer section (which is going to be written with the main html) to be at the bottom of the page. Is there any Javascript or anything I can use to display a portion of the html to be always at the bottom of the page?

01-14-2004, 03:39 PM
Look into CSS and absolute positioning.

<style type="text/css">
#footer {
position: absolute;
bottom: 0;
width: 100%;

01-14-2004, 03:53 PM
I am not that familiar with this positioning thing. Is there any where I can look for more information?

Becasue my page it with html tables. So just for the bottom portion can I use positioning?

01-14-2004, 04:20 PM
Why don't you slide over to our HTML & CSS forum (http://www.codingforums.com/forumdisplay.php?s=&forumid=13) and check out what's happening over there?

01-14-2004, 06:06 PM
/me just a whispers® to che...
ya gots just a typo® in your footer.html :O(((

<body topmrgin="0" ....

just a thought® you might like to knowww...:O)))

01-14-2004, 10:02 PM
Thanks. The div tag worked fine for me.

01-14-2004, 11:23 PM
I actually do the all the time for my sites. I call the javascript file,

<script language="JavaScript" src="menu.js"></script>

then use


document.write(' <a href="index.html" class="m" target="_top">&nbsp;Arena Home&nbsp;</a> <br><br>');

document.write(' <a href="advertising.html" class="m" target="_top">&nbsp;Advertising&nbsp;</a> <br><br>');


This way all pages have the same menu, and is very easy to update the menu for all pages.

01-15-2004, 07:08 AM
Do you mean something like this (http://www.dynamicdrive.com/dynamicindex1/staticmenu.htm)?