Android Style Overscroll Effect In jQuery - Anscroll.js

Anscroll.js is a jQuery plugin that makes use of CSS3 transforms to create an Android inspired bounce overscroll effect in your mobile and desktop web app.

How to use it:

1. Download the zip, then upload the anscroll.js and anscroll.png to the server.

2. Link to jQuery library and the anscroll.js script.

<script src="https://code.jquery.com/jquery-3.2.1.min.js" 
        integrity="sha384-xBuQ/xzmlsLoJpyjoggmTEz8OWUFM0/RC5BsqQBDX2v5cMvDHcMakNTNrHIW2I5f" 
        crossorigin="anonymous">
</script>
<script src="anscroll.js"></script>

3. Make sure you web page is scrollable.

<div class="container">
  Scroll down!
  More content here
</div>

.container {
  min-height: 200vh;
}

4. Override the default styles of the overscroll effect in the CSS as these:

#topScroll {
  transform: rotate(180deg);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 20px;
}

#bottomScroll {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 20px;
}

---

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