jQuery Plugin For Sticking Element To Top On Page Scroll - stopattop

stopattop is a fancy jQuery sticky element plugin that tracks scroll movements and stops any DOM element from scrolling when it reach the top of the webpage. You can stop multiple elements at the top of the page, and they will just overlap one another.

How to use it:

1. Place jQuery JavaScript library and the jQuery stopattop plugin at the bottom of the webpage.

<script src="//code.jquery.com/jquery-1.12.0.min.js"></script>
<script src="src/jquery.stopattop.js"></script>

2. Layout your HTML as you normally would. You should not need any HTML or CSS changes for this to work. Use a jQuery selector with the stopAtTop() extension and when the selected element(s) (e.g. header navigation) reach the top of the page, they will stop scrolling.

$(document).ready(function() {
  $("nav").stopAtTop();
});;

Change log:

2017-06-22

• Update stopped element to match placeholder width

---

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