Display image on top of another image on rollover

I want to display a zoom image (on mouseover) on top of certain images to imply 'click here to zoom'. I don't want to use a cursor.

I'm sure there's a good way to do this with javascript jQuery but I don't know it.

Does anyone have any good ideas?

Solution

HTML:

<a href='big.jpg'>
    <img src='mini.jpg' alt='a kitten'>
    <span>Click to view larger</span>
</a>

CSS:

a > img + span {display: none}
a:hover > img + span {display: inline}

Then style however you like.