Super Simple Scroll Up To Top Plugin with jQuery

Just another jQuery plugin that inserts an auto- fade in/out scroll up to top button into the body when you scroll down the window.

How to use it:

1. Load jQuery library and the jquery.scrolluptotop.js script at the bottom of your document.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="src/jquery.scrolluptotop.js"></script>

2. A little bit of CSS to style & position the scroll up to top button.

#ScrollUpToTop {
  position: fixed;
  right: 30px;
  bottom: 30px;
  width: 50px;
  height: 50px;
  z-index: 1000;
  border: none;
  border-radius: 5px;
  background: rgba(0,0,0, 0.4);
  color: #FFF;
  font-size: 40px;
  text-align: center;
  padding-top: 10px;
}

#ScrollUpToTop:hover { background: rgba(0,0,0,0.7); }

3. That's it. When you click on the scroll to top button, the page will be scrolled to the top with a smooth scrolling animation. The plugin currently provides a speedUp option to specify the duration time of scrolling animation.

(function($){
  $.ScrollUpToTop({
    "speedUp":1500
  });
})(jQuery);

4. More configuration options.

$.ScrollUpToTop({
  "scrollText": "^",
  "scrollClass": "scrollToTopDef",
});

Change log:

2017-07-08

• Add speedUp option

2015-01-05

• Add speedUp option

---

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