View only certain parts of an image

Hi I'd like to only be able to see a certain part of an i开发者_运维问答mage on my site, and I think if I rememer correctly I need to use javascript for this? Could anyone give me a code for this?

More specifically, this is the image:

I'd like to be only able to see the front of the head. The diagram for this image is:

Thanks. If this is not on the right website, it would be great if it could be moved.

---

You can use CSS to achieve this. Set the image as background, set height/width of the part you want to see and set background position to position the part you want to see into the "window" you created.

http://www.askapache.com/css/css-background-image-sprite.html

---

well.. you define an element ( a div ) which should be the image "container" and you set the full image as it's css "background-image". then you control the image's offset with the css "background-position" rule.
It can be done only with css, but you can alter the css rules dynamically through javascript.
a good example is the jquery ui page :

you can see that it loads the whole icon-set as a background-image to any icon displayed in the site and then it "moves" the background to the desired position through background-position