Again, best viewed in WebKit based browsers (Safari and Chrome). However, these are somewhat supported in current versions of Firefox and Opera as well (timing seems a bit odd in some cases). WebKit has more control over specifics. Move your cursor over the image to observe the :hover transition effects. Make certain you view the source code to observe the various browser specific hacks (I have tried to be as consistent as possible).
We can also control these transitions with a click event handler (JavaScript). If one is using a mobile device, a click is the same as a tap. In the example below, click onn the image to set the class. If the class is already set, another click will set the image back to its original state. I just placed all the necessary JavaScript inline as an oncllick event handler.