Lightweight jQuery Parallax Scrolling Plugin - VScroll.js
File Size: | 2.01MB |
---|---|
Views Total: | 4534 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

VScroll.js is a super tiny jQuery plugin to implement vertical parallax scrolling effect on your website when scrolling up or down.
Basic Usage:
1. Load the jQuery javascript library and vscroll.js in the page.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script type="text/javascript" src="js/jquery.vscroll.js"></script>
2. Create the html.
<section class="page_section" id="first"></section> <section class="page_section" id="first_2"></section> <section class="page_section" id="first_3"></section>
3. The sample CSS.
#first { background: url(../images/bg_gray_0.png) 50% 0 no-repeat fixed; } #first_2 { background: url(../images/bg_gray_1.png) 50% 0 no-repeat fixed; } #first_3 { background: url(../images/bg_gray.jpg) 50% 0 no-repeat fixed; overflow: hidden; } #first, #first_2, #first_3 { -moz-background-size: cover; -webkit-background-size: cover; background-size: cover; overflow: hidden; }
4. The javascript.
<script type="text/javascript"> $(document).ready(function(){ $('#first').VScroll(0.1); $('#first_2').VScroll(0.1); $('#first_3').VScroll(0.1); }); </script>
This awesome jQuery plugin is developed by JeewhanKim. For more Advanced Usages, please check the demo page or visit the official website.