Simple Floating Action Button – jQuery Plugin

File Size:4.44 KB
Views Total:295
Last Update:March 16, 2018
Publish Date:December 2, 2017
Official Website:Go to website
License:MIT

Docked Link is simple jQuery plugin used to create a floating link that will always stay at the center-left or center-right on scroll down or up in the web page. many ways use for sticky action buttons such as social sharing, email subscription, etc.

How to use it:

1. Include the JavaScript file:

<script src="//code.jquery.com/jquery-3.2.1.slim.min.js"></script>
<script src="docked-link.js"></script>

2. Create the docked link as this:

<a id="myLink" href="http://www.jqueryshare.net">Link To jqueryshare</a>

3. Add CSS style:

#myLink {
  display: block;
  width: 120px;
  padding: 8px 8px 8px 14px;
  background :#2980B9;
  color: #fff;
  text-decoration: none;
  text-align: center;
  line-height: 20px;
  border-top-right-radius: 11px;
  border-bottom-right-radius: 11px;
}

4. Activate the docked setting:

$('#myLink').dockedLink({
  pixelsFromTop: 1000,
  position: 'right' // or 'left'

});

Done 🙂