Smart Configurable Back To Top Button In jQuery - jquery.gotop.js
| File Size: | 3.98 KB |
|---|---|
| Views Total: | 4816 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
Yet another jQuery back to top plugin that enables a highly customizable button to smoothly scroll back to the top of the webpage when clicked.
More Features:
- Auto shows the back to top button on scroll down.
- Auto hides the button when you reach the top of the webpage.
- Can be set to only work on mobile devices.
How to use it:
1. Create an empty element in which you want to display the back to top button.
<script src="//code.jquery.com/jquery.min.js"></script> <script src="jquery.gotop.js"></script>
2. Include jQuery library and the jquery.gotop.js script at the bottom of the webpage.
<script src="//code.jquery.com/jquery.min.js"></script> <script src="jquery.gotop.js"></script>
3. Initialize the plugin to generate a default back to top button that displays at the 'Bottom Right' of the webpage.
$('#gotop').gotop();
4. Override the following options to customize the back to top button as per your needs.
$('#gotop').gotop({
// Background color
background : '#000',
// Icon color
color: '#fff',
// Rounded button?
rounded: true,
// width/height
width: '45px',
height: '45px',
// bottom position
bottom : '25px',
// right position
right : '25px',
// Window height after which show the button
windowScrollShow: 400,
// animation speed
speed: 800,
// custom html for the back to top button
customHtml: '',
// Show button only on mobile device
mobileOnly: false
});
This awesome jQuery plugin is developed by tomaggio83. For more Advanced Usages, please check the demo page or visit the official website.











