jQuery Plugin To Create Multiple Sticky Elements On The Page - jSticky
File Size: | 10.1 KB |
---|---|
Views Total: | 1043 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
jSticky is a minimal jQuery plugin which provides a simple way to make anything (site navigation, sidebar widgets, etc) fixed at the top of the screen when you scroll past them.
How to use it:
1. Include the jquery.jsticky.js script after jQuery library but before you close the body tag.
<script src="//code.jquery.com/jquery.min.js"></script> <script src="jquery.jsticky.js"></script>
2. Call the function sticky()
on any element you prefer.
$("#el").sticky();
3. Set the CSS z-index property of sticky element(s).
$("#el").sticky({ zIndex: '999' });
4. Specify how far down the sticky element is from the top.
$("#el").sticky({ topSpacing: 0 });
5. Specify the stop point.
$("#el").sticky({ // Id, class, or number value stopper: '.sticky-stopper' });
This awesome jQuery plugin is developed by AndrewHenderson. For more Advanced Usages, please check the demo page or visit the official website.