Elsewhere: William Flake’s “Of Squirrels and Men”
Posted by Kyle Weems on December 08, 2009Last Friday in response to a question by Tyrun I posted a little micro-tutorial about how I achieve the parallax scrolling header for the site, walking through the steps on setting up images, CSS, HTML and JavaScript (in particular, I use jQuery). I also learned a thing or two about how annoying WordPress can be with code snippets in posts (Use <pre>. Really. I don’t know why I didn’t.)
Everything in the tutorial is exactly as it was on my site at the time of writing. However, this is no longer the case. Over the weekend I got a tweet from William Flake indicating a modification he made to the code to prevent a “jump” that occurred when you first moved the mouse into the header. I liked his alterations so much that I’ve made use of them in my code.
This week William wrote about his code alterations over at his site Unfinished Thoughts in a post entitled Of Squirrels and Men. If you enjoyed my parallax code, please take a look at what changes he made. They’re definitely worth a gander.
Tags: elsewhere, javascript, jquery, parallax, tutorial, william flake
Very nice work, Mr Flake. At first, I didn’t see any difference, but after I cleared my cache, it worked flawlessly. As I moved my cursor from left to right, just below the trees, I also moved it up into the trees and back out several times. No jerks allowed!
Nice – I always hated your header for the very reason of the ‘jump’. Much nicer now!
Is there a reason why to use the working draft ‘mouseenter’ instead of the recommended ‘mouseover’ ?
@David – Actually, no reason at all. I’ve not had much experience with client-side scripting, and ‘mouseenter’ was the result of my searching for a property that allowed me to record the position of mouse entry. After some brief testing, it looks like ‘mouseover’ works equally well.
Oh, beautiful! There was a pervading feeling in the old version that one was limited to looking through a window — I could go one way or another to see a slightly different view, but that was all.
Now I can scroll forever. That jump was horrid.
(Also, you said a little while ago that your captcha is broken. Is it always showing the robot? That’s all I’ve seen, lately.)
@William – well not quite equally well. It doesn’t work on my browser : Opera. “mouseenter” is only in the draft state.
@Michael – Re: the CAPTCHA. The new version uses a single image, but ups the challenge by requiring the user to recognize the image and match it with the proper word to write in the box (rather than clicking on a given box, which even a robot can get right 33% of the time).