jQuery Plugin To Fix Element Within Its Parent Container - nail
File Size: | 42.2 KB |
---|---|
Views Total: | 1475 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
![jQuery Plugin To Fix Element Within Its Parent Container - nail](https://www.jqueryscript.net/images/jQuery-Plugin-To-Fix-Element-Within-Its-Parent-Container-nail.jpg)
Yet another jQuery sticky element plugin which sticky a specific element to the top of the webpage until it reaches the bottom of its parent container. Useful for creating a sticky sidebar on your webpage.
How to use it:
1. Add references to jQuery library and the jQuery nail plugin into your html page.
<script src="//code.jquery.com/jquery.min.js"></script> <script src="dist/jquery.nail.min.js"></script>
2. The JavaScript to make the element '#leftNav' sticky relative to its parent container.
$('#leftNav').nail();
3. Default plugin options and callback functions.
$('#leftNav').nail({ fixTop: 0, onTop: function(elem) { // ... }, onBottom: function(elem) { // ... }, onFixed: function(elem) { // ... } });
Change log:
2016-11-14
- added more option.
This awesome jQuery plugin is developed by cobish. For more Advanced Usages, please check the demo page or visit the official website.