Sticky Sidebar

Pure JavaScript plugin for making smart and high performance sticky sidebars.
Basic Example
Scrollable Sticky Element
For complete documentation and examples see abouolia.github.com/sticky-sidebar

Why is sticky sidebar so awesome?

• It does not re-calculate all dimensions when scrolling, just necessary dimensions.
• Super smooth without incurring scroll lag or jank and no page reflows.
• Integrated with resize sensor to re-calculate all dimenstions of the plugin when size of sidebar or its container is changed.
• It has event trigger on each affix type to hook your code under particular situation.
• Handle the sidebar when is tall or too short compared to the rest of the container.
• Zero dependencies and super simple to setup.

Install

You can download sticky sidebar jQuery plugin from Bowser, NPM or just simply download it from this page and link to the sticky-sidebar.js file in your project folder.

Bower

If you are using bower as package manager:

bower install sticky-sidebar

NPM

If you are using NPM as package manager:

npm install sticky-sidebar

Usage

Your website’s html structure has to be similar to this in order to work: