I'm pleased to present you with part one of a two part series on creating a photo site using PHP, jQuery, and AJAX. Originally, I intended to fit the entire tutorial into one screencast, but that quickly became a pipe dream as I realized that there was simply too much to cover. Nevertheless, even if you only watch this first video, you should learn a great deal.

After reading Dave Shea's article on CSS Sprites using jQuery to produce animation effects, I felt like playing around with things to see what could be done but accomplish it with a simpler HTML structure (no need for adding superfluous tags) and simpler code, too.

Changing the position of the background image felt to be the best approach to creating the type of effect we're looking for (and I'm not the first to think so: see the examples at the end of this article).

Anchor are really useful when you have alot of content, being able to jump 1 page of content can be really handy, that sometimes happen with corporate websites.

Unfortunately an anchor is just plain bad in design, when a user click on a link he pretty much always think that he will go to another page, but in this case, he just jump down the content, this can be really disorienting, even for me, when it is not clear a link is an anchor and not a normal link.

Creating tabbed navigation system that works across all the main browsers can be troublesome at times, so in this tutorial I’ll show you how to create a fully functional tabbed content area for your website using CSS and the excellent jQuery.