Erik Lopez .net

I think the candidates on Lost are up for the Nobel Peace Prize. If Obama qualifies for nothing, then crash landing on an island works. - March 09, 2010 20:32:31

Parallax navigation

My first major web design conference experience was last August at An Event Apart 2008 in San Francisco.  It was an awesome conference and if travel restrictions are lifted at my day job anytime soon I’m hoping to go back in ‘09.  During the conference, or more specifically, during Dan Cederholm’s presentation, Implementing Design: Bulletproof A-Z, many of us were first introduced to Clearleft’s Silverback application’s website and it’s clever use of CSS to mimic an animation technique called “parallax scrolling”.  Paul Annett, Clearleft’s designer, gives a great explanation of the effect and the underlying CSS over at Vitamin.

When I first saw the technique in action, I was blown away by both the simplicity of the technique, as well as the cleverness of it all.  Sometimes at the ol’ 9 to 5, I don’t think I’ll ever have opportunity, let alone the time, to devise and implement such innovation.  While the artistry is not lost on me, I felt the parallax effect could be used somewhere more visible to the masses in order to give a page’s design some sense of motion.  In order to do that, I wouldn’t be able to rely on CSS alone, so I turned to the all-powerful jQuery.

Read the rest of this entry »