loading... Pacem JS

Sticky Header

The PacemStickyHeaderElement eases the functionalities of a material-design-like header.

<pacem-sticky-header visibility="quickreturn"></pacem-sticky-header>

It automagically binds itself to the ancestor Shell element and then coordinates the appearence of the actual header based on the user' scrolling behavior.

In this page a PacemStickyHeaderElement gives the shared header a "sticky" behavior.


CSS Classes

The Shell gets decorated with specific CSS classes accordingly to the current sticky state: