Lightweight Animated Scroll To Top Plugin - scrollUp
| File Size: | 49.5 KB |
|---|---|
| Views Total: | 10113 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
Scroll To Top is an useful feature to the vistor to get back to the top of the page when scroll down the page. scrollUp is a lightweight jQuery Plugin that helps you easily create Scroll To Top feature with smooth scrolling effect. It comes with 3 themes, so that you can customize your Scroll To Top button via themes CSS.
How to use:
1. Include jQuery Library and scrollUp.js
<script type="text/javascript" src="js/lib/jquery-1.8.3.min.js"></script> <script type="text/javascript" src="js/jquery.scrollUp.min.js"></script>
2. Include Theme CSS
<link id="scrollUpTheme" rel="stylesheet" href="css/themes/pill.css"> <link id="scrollUpTheme" rel="stylesheet" href="css/labs.css">
3. Call the plugin with options
<script>
/* scrollUp Minimum setup */
$(function () {
$.scrollUp();
});
/* scrollUp full options
$(function () {
$.scrollUp({
scrollName: 'scrollUp', // Element ID
topDistance: '300', // Distance from top before showing element (px)
topSpeed: 300, // Speed back to top (ms)
animation: 'fade', // Fade, slide, none
animationInSpeed: 200, // Animation in speed (ms)
animationOutSpeed: 200, // Animation out speed (ms)
scrollText: 'Scroll to top', // Text for element
activeOverlay: false, // Set CSS color to display scrollUp active point, e.g '#00FFFF'
});
});
*/
</script>
Change log:
v2.1.0
- Add option to set a custom title to the tag
- Code optimisations
- Destroy method
- Scroll distance from bottom
- Easing implimentation (1.3)
- Grunt intergration
- Travis CI intergration
- Update jQuery to 1.10.2
This awesome jQuery plugin is developed by markgoodyear. For more Advanced Usages, please check the demo page or visit the official website.











