jQuery Plugin To Auto Scroll Down Html Page - Slow Auto Scroll

Slow Auto Scroll is a jQuery plugin that allows to automatically scroll down a long web page while you're reading.

Basic usage:

1. Load the jQuery slow auto scroll plugin after jQuery JavaScript library.

<script src="jquery.min.js"></script>
<script src="js/slowautoscroll.js"></script>

2. Create an auto scroll control which allows the visitor to start / stop the auto scroll as well as choosing a scroll speed.

<ul class="scroller">
  <li class="scroll"><img src="images/click.png" class="img" alt=""></li>
    <ul class="speeds">
      <li class="slow"><img src="images/turtle.png" class="img" alt=""></li>
      <li class="med"><img src="images/rabbit.png" class="img" alt=""></li>
      <li class="fast"><img src="images/cheetah.png" class="img" alt=""></li>
    </ul>
</ul>

3. The required CSS to style the auto scroll control.

ul.scroller {
  position: fixed;
  top: 0;
  right: 10px;
  list-style-type: none;
  padding: 0;
}

ul.speeds {
  padding-left: 0;
  display: none;
  list-style-type: none;
}

ul.scroller li {
  text-align: center;
  font-family: 'Lato', sans-serif;
  margin-right: 10%;
}

ul.scroller li:hover {
  background: rgba(255,255,255,0.4);
  cursor: pointer;
  border-radius: 20px;
  margin-right: 10%;
}

.scroller li {
  padding: 5px;
  color: black;
  position: relative;
}

4. Default speed settings, edit these to set your own speed.

var settings = {
    slowSpeed: 75000,
    mediumSpeed: 40000, 
    fastSpeed: 20000
};

---

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