Simple jQuery Sticky Plugin - hachiko

hachiko is a lightweight (~2.5kb minified) and easy-to-use jQuery plugin that makes any elements sticky on the screen when scroll down the page. Instead of changing the position of the element on scroll down, this plugin creates a clone of the original element and set the clone to be fixed positioned so the original layout is always preserved.

Related plugins:

• Yet Another Sticky Element Plugin For jQuery - sticky.js
• Sticky Top Menu Bar with CSS3
• Sticky Any Element Plugin with jQuery
• jQuery Contained Sticky Sidebar Plugin - stickyMojo
• Content Sticky on Scroll with jQuery - Stickem
• Fixed Position Elements Plugin for jQuery - Fixer
• jQuery Plugin For Fixed Position Elements - lockfixed
• Fixed Table of Contents Plugin with jQuery
• Fixed Position Top Menu Bar with jQuery and CSS3 - nagging-menu
• Simple jQuery Sticky Fixed Position Plugin - fixto
• Customizable jQuery Fixed Position Plugin - fixie
• Simple jQuery Sticky Elements Plugin - jQuery Pin

Basic Usage:

1. Include the latest jQuery library and jQuery hachiko plugin on the web page

<script type="text/javascript" src="http://code.jquery.com/jquery-2.0.0.min.js"></script>
<script type="text/javascript" src="jquery.hachiko.1.0.0.min.js"></script>

2. Create a container for sticky elements

<div id="sticky">...</div>

3. The javascript

<script type="text/javascript">

$("#sticker").hachiko({
top: 0 // integer value in pixels to position the element from the top after it's stickied on the screen.
});
</script>

Change log:

v1.1.0 (2013-10-08)

• added static method to retrieve reference to "stickier"/cloned element

---

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