Footer Reveal on Scroll

I recently came across this neat way to present footers while browsing around and decided to try and replicate it. It works by setting position: fixed; and z-index: -1; on our <footer> tag, and on our last article we add a large margin-bottom to reveal the content beneath. It’s very easy to implement if your footer has a static height, and of course works for multiple breakpoints via @media queries.

Here is a quick codepen, and you can pull the source code here.

Design, Development, Tutorials