Footer concept

Here is an effect I want to show with you, the idea is simple. The footer is not visible until you actually scroll to it. So, scroll!

[button url=”http://bassta.bg/demos/footertest/” style=”green” size=”large” type=”square” icon=”view” target=”_blank”]VIEW DEMO [/button] [button url=”http://codepen.io/bassta/pen/DdiaK/” type=”square” icon=”link” target=”_blank”] FORK AT CODEPEN [/button]

 

See the Pen Footer concept by Chrysto (@bassta) on CodePen.

New Pen: Header scroll effect

Recently I had to develop one-pager, that had complicated animation in the header, that should progress forward/backward on page scroll. Because the page had to be very light, I decided to drop jQuery and TimelineMax and include only TweenLite and CSSPlugin. Here is the result:

See the Pen Page Header animation by Chrysto (@bassta) on CodePen.850

The script is very compact, easy to use and modify, cross-browser ( Actually DOMContentLoaded is supported IE9+ ).

Have fun forking and modifying it.