jQuery plugin that provides an easy way to create a “sticky” page footer. What is a sticky footer? — It is a footer that remains attached (or “stuck”) to the bottom of the browser viewport even when the browser viewport height exceeds the implicit height of the page content.
No numeric configuration with dynamically-changing and arbitrary footer / content areas heights.
No absolute or relative positioning.
No other funky CSS tricks and hacks, in fact no CSS required.
Works on IE6+.
Works on the default Android Browser.
Click here for the demo page.
Works by dynamically altering the static height of an explictly-designated expander <div> as the viewport height is varied by the user, to make another explicitly-designated footer <div> always end-up statically-positioned at the very bottom of the page, even if the page content above the expander <div> does not reach that far down.
The expander <div> height becomes 0 when the page content meets of exceeds the height of the viewport, making the footer immediately follow the content in such case.
The page container, the expander, and the footer <div>s must be explicitly designated in the page markup, see README and INSTALLATION_INSTRUCTIONS for details.
Please post issues / bugs to https://github.com/maratbn/EZ-Sticky-Footer/issues.
Copyright (c) 2010-2018 Marat Nepomnyashy
Except where otherwise noted, this webpage is licensed under a Creative Commons Attribution 3.0 Unported License.
Background wallpaper by Patrick Hoesly, used under Creative Commons Attribution 2.0 Generic License.