This is the sprite I used for the button images in Photog.

Basically the way it works is each button on the page has a defined height and width, and is given this image for its background.  Depending on which button it’s assigned to, the background image will shift up/down/left/right to align itself properly within that box.

The advantage of this over using individual images for each button is that this will load all at once, not just when it’s called.  For example, have you ever rolled over a button and noticed a pause before its hover state showed up? That’s because the image used for rolling over had to be loaded before you could see it.