- a container for the background image
- the nav elements
- the ‘current’ nav element ID
- the animation’s horizontal track (the y coordinate of the background-image)
- the left offset of the image in relation to the nav element
jQuery is a great library for this type of task but out of the box, it can’t animate background position properly because of the need to animate two values instead of just one (too bad not all browsers implemented the non-standard background-position-x and -y like Internet Explorer). Grab the latest version (1.0.2 as of this writing) of the Background-Position plugin. Previous versions didn’t support negative or decimal values properly.