Adding movement to our site's header—Parallax effect

For this first modification, we are going to work with one of my favorite effects, the Parallax effect. We are going to use this in our header. If you remember our template, our header look like this:

Though this header looks fine with our template (I did it myself, so don't be a critic), we want something more eye-catching. We are going to change this header to a Parallax-powered one.

If you have never seen a Parallax effect, I think we can describe it as a mimic of a 3D effect. It basically consists of some images, each one on top of the other. We can use this to create an illusion of distance. We can see this better with a representation, as shown in the following picture:

As we can see there are three elements in the image: a cat, a car, and the moon. The cat is in the first instance...