A lot of the traffic I get to this blog is related to the jQuery Parallax script I wrote quite some time ago. Looking at the code now, I don’t think I’d change too much about it, perhaps use
.on('mousemouse', ...) instead of
.mousemove(), but mostly it seems to serve it’s function quite well. Since the only real functions being called are
.css() it should still be working with the latest versions of jQuery and unless they decide to majorly change the API, it should continue to work too!
Since my example was on a fairly empty page, I thought I’d link to a couple of sites that are using it in the real world:
If you’re using the script and think your sites is a good example of utilising the parallax effect, please leave me a message!
So I’ve updated the parallax script a little. It’s called in a more jQuery like manner now and has a couple of useful options for inverting the movement and changing the unit of measurement to any jQuery/CSS supported unit.
You can see a demo of the updated script, or just download the package (includes jQuery 1.3.2).
Edit: I’ve added a post with a couple of working examples here.
I’ve seen some very cool parallax effect around lately, especially liking the Silverback site. But none of them are particularly interactive, so I thought I’d make a small implementation of the Parallax effect that interacts with the mouse.
Very early stages (and I haven’t tested it on IE yet… but you could just you conditional comments to exclude ‘those’ people anyway…) but it seems to be working ok. The options aren’t really simple, but they should be fairly self-explanatory…
Check out the demo (it is a very poor demo, please don’t look at the images, imagine it with a lovely hand drawn vector!) and get it here (minified).
Update: Created a quick demo of the silverback homepage with interactive parallax.
Update 2: Tested on IE8, seems to work fine!
Update 3: I have modified the script slightly, you can view the post here.