Beautiful Back-To-Top Button with jQuery

File Size: 49.6 KB
Views Total: 7770
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Beautiful Back-To-Top Button with jQuery

This jQuery Plugin makes it easy to add a Beautiful BACK-TO-TOP Button when scrolling down your page. Everything is created by the plugin. No HTML code required.

How to use it:

1. Include necessary elements in your head section

<link rel="stylesheet" type="text/css" href="BackToTop.jquery.css" media="screen" />
<!-- jQuery files -->
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery-ui.js"></script>
<script type="text/javascript" src="BackToTop.min.jquery.js"></script>

2. Call the plugin

<script type="text/javascript">
$(document).ready(function(){
// simple BackToTop plugin called
BackToTop();
// more complex BackToTop plugin called
BackToTop({
text : 'My awesome text', // Text written into the link
autoShow : false, //Does the link appears during scrolling the page or is always displayed ?
timeEffect : 750 //Duration (in ms) of the scrolling effect, from the bottom to the top of the page
appearMethod : slide, // How does the link appear ? Can be set to 'fade', 'slide' or empty
opacityFloat : 1, // Opacity (0-1) of the BackToTop button
topInteger : 10 // In pixel, position of the BackToTop link from the top of the document
});
});
</script>

Change log:

v1.1

  • New options : "opacity" & "top"

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