Using jQuery for Background Image Animations

Fig. 1 Figure 1 is a little more elaborate. The amount of visible space in the normal and hover states are at the very top and bottom of the image. The large gradient in the middle generates a fade-in/out effect when animated over time. The larger the gradient, the less it'll feel like it's moving in from the bottom and feel more like it's actually fading in and out. Fig. 2 In Figure 2, the before and after states are on the left and right but a simple slant can create an interesting effect. http://snook.ca/archives/javascript/jquery-bg-image-animations/