Sticky is a jQuery plugin that gives you the ability to make any element on your page always stay visible.

Sticky in brief

• When the target element is about to be hidden, the plugin will add the class className to it (and to a wrapper added as its parent), set it to position: fixed and calculate its new top, based on the element's height, the page height and the topSpacing and bottomSpacing options.

topSpacing: (default: 0)
Pixels between the page top and the element's top.

bottomSpacing: (default: 0)
Pixels between the page bottom and the element's bottom.

className: (default: 'is-sticky')
CSS class added to the element's wrapper when "sticked".

wrapperClassName: (default: 'sticky-wrapper')
CSS class added to the wrapper.

center: (default: false)
Boolean determining whether the sticky element should be horizontally centered in the page. 

getWidthFrom: (default: '')
Selector of element referenced to set fixed width of "sticky" element.

widthFromWrapper: (default: true)
Boolean determining whether width of the "sticky" element should be updated to match the wrapper's width.Wrapper is a placeholder for "sticky" element while it is fixed (out of static elements flow), and its width depends on the context and CSS rules. Works only as longgetWidthForm isn't set.

responsiveWidth: (default: false)
Boolean determining whether widths will be recalculated on window resize (using getWidthfrom).

zIndex: (default: auto)
controls z-index of the stickied element.