iOS/Android Like Overflow Scroll Effect with Fancy Scroll Plugin

Fancy Scroll is a lightweight jQuery plugin that mimics the overflow scroll effects on iOS / Android devices when scrolling to the top or bottom of your web page (container).

How to use it:

1. Include the latest jQuery javascript library and jQuery fancy scroll plugin in the header

<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript" src="jquery.fancy-scroll.js"></script>

2. Just call the function if you want to implement the effect on current web page

<script>
$(document).ready(function(){
	    
$(window).fancy_scroll();
      
});
		
</script>

3. You can also implement the plugin on a given container

<div class="demo">
<div class="innerWrapper"
...
</div>
</div>

4. Call the plugin with options

<script>
$(document).ready(function(){
      
$(".demo").fancy_scroll({
innerWrapper: ".innerWrapper",
animation: "bounce",
bounceDistance: 100,
animDuration: "0.3s",
animEasing: "cubic-bezier(0.175, 0.885, 0.420, 1.310)",
});
});
		
</script>

---

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