Un Footer fisso in fondo alle pagine
In realtà non è un javascript, ma un semplice div creato con i CSS, utilizzeremo una funzione javascript solo per permettere di nascondere il piè pagina
Il foglio di stile utilizzato è il seguente
<style>
#bottom-banner{
position:fixed;
bottom:0px;
height:40px;
width:100%;
background:#000000;
}
</style>
Mentre qui abbiamo il codice per creare il box in fondo alla pagina e il codice che richiama la funzione hidebar per nascondere il box.
<div id="bottom-banner">
<div align="center"><img src="img1.jpg" width="474" height="35">
<a onclick="javascript:hidebar();" href="javascript:void();">Nascondi</a></div>
</div>
La funzione javascript che permette di nascondere il box
<script type="text/javascript">
function hidebar(){
document.getElementById('bottom-banner').style.display = "none";
}
</script>
Come potete notare, allo scorrimento della pagina il nostro box piè pagina, rimane incollato in fondo.
Conclusioni
Una nota importante riguarda la compatibilità tra i browser, in special modo con IE che sembrerebbe non digerire tanti Tag nuovi introdotti dal HTML5, date un'occhiata alla prima riga del file esempio da scaricare.
in questo caso specifico per non complicare molto la compatibilità abbiamo utilizzato un DOCTYPE di tipo Strict.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Commenta
questo articolo Visualizza
i commenti (-0,5)
