/*
Author: Marcello Barile aka Aistu
Year: 2008
############# DESCRIPTION #############
Con Absolute il footer si posiziona correttamente, a fondo pagina, solo se il contenitore รจ minore dell' altezza dello schermo.
Per risolvere questo problema si cambia dinamicamente il tipo di posizione (da absolute e relative) del footer al caricamento, tramite JS
#######################################
############# USAGE ###################
------- Your CSS: ----------
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
color: #666666;
}
body, html {
margin: 0px;
padding: 0px;
height:100%;
}
body>div#container {
height: auto;
min-height: 100%
}
#footer {
padding: 0 0px;
margin-top: auto;
margin-bottom: auto;
background-color: #EAEAEA;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #CCCCCC;
width: 100%;
height: 60px;
position:absolute;
bottom: 0;
}
---------------------------
------ Your HTML: ---------
[...]
Your contents
[...]
---------------------------
*/
function setFooterPos(){
myContainer = document.getElementById('container');
myFooter = document.getElementById('footer');
if(myContainer.clientHeight > screen.availHeight-180 || document.body.clientHeight < 450){
//alert('set relative');
myFooter.style.position = "relative";
}else{
//alert('set absolute');
myFooter.style.position = "absolute";
}
}