A Simple, Usable jQuery Plugin To Make A Div Sticky | stickySidebar

How to make use of it:

1. Place the JavaScript stickySidebar.js after loading the most recent jQuery library.

<script src="/path/to/cdn/jquery.min.js"></script>
<script src="/path/to/stickySidebar.js"></script>

2. Attach the function sticky sidebar to the sidebar component and the plugin will deal with the remainder.

<aside id="sidebar">
  <h3>Sidebar</h3>
</aside>

$(function(){
  $('#sidebar').stickySidebar();
});

3. Specify the distance between the sticky sidebar and the highest of the web page, often barely higher than the height of your sticky header.

$(function() {
  $( '#sidebar' ).stickySidebar({
    topPadding: 100
  });
});

4. Specify the duration of the animation.

$(function() {
  $( '#sidebar' ).stickySidebar({
    animationDuration: 500
  });
});

5. Increase the footerThreshold worth to prevent the sticky component from pushing your footer aspect down.

$(function() {
  $( '#sidebar' ).stickySidebar({
    footerThreshold: 80
  });
});

Minimal Sticky Sidebar Using jQuery, stickySidebar Plugin/Github, sticky sidebar jquery, sticky sidebar on scroll, sticky sidebar example, sticky sidebar on scroll jquery, sticky sidebar on scroll javascript, sidebar fixed when scrolling down css, sidebar fixed when scrolling down jquery

See Demo And Download