Responsive Sticky Element Plugin For jQuery - Stickybox
File Size: | 10.2 KB |
---|---|
Views Total: | 1886 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

Stickybox is a barebone jQuery sticky element which makes any element stick to the screen on scroll, until reaching a specific element such as footer. The plugin also has the ability to disable the 'Sticky' behavior when the screen size is less than a breakpoint (default: 767px) specified in the JavaScript.
How to use it:
1. Place jQuery library and the jQuery Stickybox plugin's script at the end of the document.
<script src="//code.jquery.com/jquery.min.js"></script> <script src="jquery.stickybox.js"></script>
2. Call the function on the target element to be stuck at the top of the webpage when scrolling down.
<div class="sidebar-box" id="sticky-box"> Sticky Element </div>
$('#sticky-box').stickyBox();
3. Plugin's default configuration options.
$('#sticky-box').stickyBox({ // From this point on and below, boxes are not sticky notStickyBreakpoint: 767, // Space between window top and boxes spaceTop: 20, // False or elements which stop the boxes stoppper: false, // Space between stopper elements and boxes stopperSpace: 20 });
This awesome jQuery plugin is developed by joergmoldenhauer. For more Advanced Usages, please check the demo page or visit the official website.