I have a few images and their rollover images. Using jQuery, I want to show/hide the rollover image when the onmousemove/onmouseout event happen. All my image names follow t
I know you're asking about using jQuery, but you can achieve the same effect in browsers that have JavaScript turned off using CSS:
#element {
width: 100px; /* width of image */
height: 200px; /* height of image */
background-image: url(/path/to/image.jpg);
}
#element:hover {
background-image: url(/path/to/other_image.jpg);
}
There's a longer description here
Even better, however, is to use sprites: simple-css-image-rollover