webtips 02 - parallax 01
Create a Parallax Website Header | ProgTuts Create a Parallax Website Header | ProgTuts This tutorial will show you how to create a cool Parallax Website Header using jQuery and the jParallax jQuery plugin. This is quite a simple experiment and you won’t need any javascript knowledge, just plain old HTML and CSS. However this has the potential to create some really stunning effects. The Files

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. Tutorial Details Last year, the Silverback App site, designed by Carsonified, created some chatter amongst the design community for its clever use of a parallax scrolling effect seen when resizing the browser window. Create a Funky Parallax Background Effect using jQuery
jQuery.spritely is a jQuery plugin created by Artlogic for creating dynamic character and background animation in pure HTML and JavaScript. It's a simple, light-weight plugin with a few simple methods for creating animated sprites such as the birds you see on this page, and dynamic scrolling backgrounds. Hello! You can use it on any html web page, and any part of the page can interact with a sprite (click anywhere on this page and wait and you'll see what we mean). Spritely.net

Spritely.net

jQuery Parallax 0.2 – Minor updates | dom111.co.uk
webdev.stephband.info Download git clone git://github.com/stephband/jparallax.git github.com/stephband/jparallax Instantiation

webdev.stephband.info

Just a quick demonstration today on using JavaScript and CSS techniques to create scrolling backgrounds. Here we layer backgrounds on top of each other and change their horizontal position to move them past the viewing area. It also uses different multipliers to move the closer objects quicker, and create a parallax effect. After you’ve checked out the parallax scrolling demo you can head back here to see how it’s written up. Using jQuery To Create Parallax Scrolling Backgrounds « Stephen McIntyre Using jQuery To Create Parallax Scrolling Backgrounds « Stephen McIntyre
How to recreate Silverback’s parallax effect How to recreate Silverback’s parallax effect When I was a lad, I remember being wowed by an effect in Sonic the Hedgehog known as parallax scrolling. Moving my little spiky friend to the right caused the foreground to move past the camera to the left faster than the background, creating a faux-3D view of Green Hill Zone. We can create a similar effect on a web page by fixing semi-transparent background images to different sides of the browser viewport, and at different horizontal percentage positions. In addition to this, blurring some of those images will emulate focus and depth-of-field. The effect can only be seen as the browser window is resized, but I really like the subtlety of this — not everybody will notice it, but it’s like a hidden Easter egg for those who do.