JQuery ljepljivo podnožje - CSS-trikovi

Općenito je CSS ljepljivo podnožje najbolji način za rad, jer radi savršeno glatko i ne zahtijeva JavaScript. Ako zahtijevano označavanje jednostavno nije moguće, ovaj jQuery JavaScript možda je opcija.

HTML

Samo pripazite da je #footer zadnja vidljiva stvar na vašoj stranici.

 Sticky Footer

CSS

Davanje postavljene visine najbezbjednije je.

#footer ( height: 100px; )

jQuery

Kada se prozor učita i kada se pomiče ili mu se mijenja veličina, ispituje se je li sadržaj stranica kraći od visine prozora. Ako jest, to znači da ispod sadržaja ima praznog prostora prije kraja prozora, pa bi podnožje trebalo postaviti na dno prozora. Ako nije, podnožje može zadržati normalno statičko pozicioniranje.

// Window load event used just in case window height is dependant upon images $(window).bind("load", function() ( var footerHeight = 0, footerTop = 0, $footer = $("#footer"); positionFooter(); function positionFooter() ( footerHeight = $footer.height(); footerTop = ($(window).scrollTop()+$(window).height()-footerHeight)+"px"; if ( ($(document.body).height()+footerHeight) < $(window).height()) ( $footer.css(( position: "absolute" )).animate(( top: footerTop )) ) else ( $footer.css(( position: "static" )) ) ) $(window) .scroll(positionFooter) .resize(positionFooter) ));