jQuery Plugin For Sticky Sidebar Widgets - scrollsWith

Yet another jQuery plugin for sticky sidebar that makes any DOM element fixed within your sidebar when the user scrolls past it.

How to use it:

1. Add both jQuery library and the jQuery scrollsWith's script to the webpage.

<script src="jquery.min.js"></script>
<script src="scrollsWith.js"></script>

2. Set the start/end position of your sticky sidebar widget.

<div data-sidebar-dummy="mySidebar"></div>
<div>
  <div class="sidebar" id="mySidebar">
    This is a sidebar!
  </div>
</div>
...
<div data-sidebar-bottom="mySidebar"></div>

3. Call the plugin on the sidebar widget and done.

$("#mySidebar").scrollsWith();

4. Set the top margin in pixels when the sidebar widget is getting stuck.

$("#mySidebar").scrollsWith({
  margin_top: 30
});

5. Change the default CSS class when the sidebar widget is getting stuck.

$("#mySidebar").scrollsWith({
  fixedClass: 'fixed'
});

5. Set the breakpoint you want to enable/disable the sticky behavior.

$("#mySidebar").scrollsWith({
  minWidth: 200
});

---

This awesome jQuery plugin is developed by falkmueller. For more Advanced Usages, please check the demo page or visit the official website.