Creating A Floating Sidebar Panel With jQuery - sideFollow

File Size: 3.51 KB
Views Total: 3216
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Creating A Floating Sidebar Panel With jQuery - sideFollow

sideFollow is a super tiny jQuery plugin for creating a float sidebar panel that will always stay at the right side of the webpage on window scroll. Great for social share widget, contact form and setting panel.

How to use it:

1. Place jQuery library and the jQuery sideFollow plugin into the webpage when needed.

<script src="//code.jquery.com/jquery.min.js"></script>
<script src="sidefollow.js"></script>

2. Create a sidebar panel and make it sticky using CSS 'position: absolute' attribute as follows:

<div class="float">I am following</div>
.float {
  position: absolute;
  width: 120px;
  height: 200px;
  top: 180px;
  right: 0;
}

3. Initialize the plugin and we're done.

$(".float").sideFollow();

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