How to create a parallax scrolling website using Skrollr.js
Today’s parallax website tutorial is a detailed explanation of the Parallax Scrolling Effect using Skrollr.js published a few weeks ago. You will learn how to create a simple parallax scrolling website using Skrollr.js plugin. If you haven’t seen the demo already, go and check it out. It will give you a clear understanding of what we are talking about in the sections below. View Demo Download Files Introduction To develop a parallax scrolling website can be a bit scary especially if you do it for the first time, but as you know the practice makes perfect. Please note, that this tutorial is suitable for a more advanced developers and attached files are the final files. 1. As a first step we need to include Skrollr.js preferably before the closing body tag. Initiate the Skrollr inside of the _main.js file. Now lets have a look at the markup and Skrollr settings of the individual slides. 2. Section height – 100% of the viewport, resized on page load 3. Section height – 310px fixed height 4. 5.
• design sites