[SOLUCIONADO] Footer en el final de mi página

[manute71]

El tamaño del body de mi página cambia dinámicante en función de un menú en acordeón vertical que tengo, y de los enlaces de mi menú.

Hasta ahora he conseguido a través de un script que mi footer se quede al final de la ventana de mi explorador, que no significa que esté abajo del todo (al final del scroll) de mi página web.

¿Podríais decirme algún script para conseguir esto?. Os adjunto el mío que tengo.
Muchísimas gracias de veras.




<script type="text/javascript">
$(document).ready(heightTest);
$(window).load(heightTest);
$(window).resize(heightTest);

function heightTest()
{
var windowHeight =$(window).height();
var documentHeight =$(document).height();
if (documentHeight > windowHeight)
{
$('#container-foot').css({'position': 'relative', 'top':'30'});
}
else
{
$('#container-foot').css({'position': 'fixed', 'bottom':'0'});
}
}
</script>

[juanito1712]

y si
<div id="conteido"></div>
<div id=pie></div>

dentro de contenido tienes el acordeon y a contenido le das
<style>
#contenido{clear:both; overflow:hidden;}
</style>

con esto y sin necesidad de javascript el tamaño de contenido debería aumentar aun con elementos flotados dentro de el y empujar a pie

[ArturoGallegos]

eso se hace con CSS, aqui te dejo codigo de ejemplo... copialo y pegalo en un documento nuevo para que lo pruebes y veas como funciona

Estructura basica HTML a utilizar

Código HTML:

<div id="site"><div>
    <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
</div></div>
<div id="footer">2013 &copy; Ag Freelance</div>
 

CSS

Código CSS:

*{margin:0;padding:0;}
html,body{height:100%;font:13px/1.2 arial,verdana,tahoma;}
#site{min-height:100%;color:#333;}
#site>div{padding-bottom:60px;}
#footer{height:60px;margin-top:-60px;background:#333;color:#fff;text-align:center;line-height:60px;}
 

[manute71]

Buenos días!!

Muchísimas gracias por todo, he conseguido solucionar el problema.
La verdad que es un placer que haya gente por aquí que se preocupe en ayudarte al tener un problema.

La solución ha sido más simple de lo que pensaba...era cuestión de CSS. Tenía limitada la altura del contenedor general.

Dado que traté de hacer el famoso sticky footer, tenía contenidos 3 divs sucesivos uno dentro de otro. Al limitar la altura del primero, el resto no se desplazaba automáticamente...menuda cabecita tengo.

Muchísimas gracias chic@s!! un saludo