jQuery Plugin To Create Customizable Fixed Html Elements - stkr
File Size: | 115 KB |
---|---|
Views Total: | 466 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
Stkr is a simple yet highly customizable jQuery plugin which allows you to make any Html elements sticky on the web page when you scroll down.
Features:
- Custom start & 'unstick' points.
- The html elements can be positioned anywhere on your web page.
- Fade in/out effects as the Html elements come into view.
Basic Usage:
1. Load the jQuery Javascript library and the jQuery stkr plugin's script at the end of your web page.
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script> <script src="js/stkr.min.js"></script>
2. Call the plugin on the target element you wish to make it sticky on your web page.
$('#target-element').stkr();
3. Available options.
// start point // When the user scrolls to this point, // the sticky element becomes fixed on the page. startSticky: 'body', // end point endSticky: null, // 'top-left', 'top-right', 'bottom-left', 'bottom-right', or 'custom' stickyPosition: 'top-left', // position options top: null, left: null, bottom: null, right: null, // offsets the point at which the element becomes fixed on the page offsetStick: 0, // offsets the point at which the element is no longer fixed on the page. offsetUnstick: 0, // horizontal or vertical horizontal: false, // toggle the visibility of the fixed element toggleVisibility: false, // fade in/fade out effects toggleFade: false
This awesome jQuery plugin is developed by francinen. For more Advanced Usages, please check the demo page or visit the official website.