In our previous post dedicated to parallax scrolling effect, New Websites with Parallax Scrolling, we’ve already described the principle of its work. And today we would like to present to your attention some resources with the help of which the parallax scrolling can be achieved. Here we’ve gathered jQuery plugins, articles and informative tutorials. In case you know any useful sources on this topic, please don’t hesitate to share with us via the comments.
jQuery plugins
jQuery Parallax Image Slider
Custom jQuery Plugin for Creating Parallax Effect Image Sliders.
Demo | Download
Jquery Image Parallax
The jQuery Image Parallax project is a plugin that gives an illusion of depth to an image with transparency (PNG, GIF) by repeating it and animating movement.
Demo | Download
Scrolling Parallax: A jQuery Plugin
Scrolling Parallax is a new jQuery plugin that binds a parallax effect to the scrollbars and mouse wheel. This allows a background image or anything else to scroll at a different pace than the web page when a user scrolls around. The parallax effect that results is an easy way to create an illusion of depth on your website.
Demo | Download
Scrollorama
The jQuery plugin for doing cool scrolly stuff.
Download
Scrolldeck
A jQuery plugin for making scrolling presentation decks.
Demo | Download
jParallax
jParallax turns nodes into absolutely positioned layers that move in response to the mouse. Depending on their dimensions these layers move at different rates, in a parallaxy kind of way.
Demo | Download
Stellar.js
Stellar.js is a jQuery plugin that provides parallax scrolling effects to any scrolling element.
Demo | Download
jQuery Scroll Path
A jQuery plugin for defining a custom path that the browser follows when scrolling.
Demo | Download
Curtain.js
This plugin allows you to create a web page with multiple fixed panels that unroll with an amusing effect. Exactly like a curtain rises.
Download
Plax
Plax is a jQuery / Ender plugin that makes it suuuuuper easy to parallax elements in your site based on mouse position. You can see it implemented in many places throughout GitHub, including the 404 page, the 500 page, and the about page.
Demo | Download
Articles and Tutorials
Parallax Slider With jQuery
Building a parallax scrolling storytelling framework
jQuery Parallax Tutorial – Animated Header Background
In this tutorial i will explain in detail how to create your own parallax background effect using jQuery to manage the animation aspects of the banner which you could use for your header background.
Demo
Create a funky parallax background effect using jQuery
In this tutorial, we’ll be using JQuery to take a horizontally scrolling website and add a parallax scrolling background effect reminiscent of old-school 2D platform games like Sonic the Hedgehog.
Demo
Build a parallax scrolling website interface with jQuery and CSS
Parallax scrolling website interfaces have been popping up all over the place recently. I didn’t want to miss out on the fun, so I have put together a parallax scrolling demo built using jQuery and CSS.
Demo
