If you have the Custom Design upgrade, you can easily create thumbnails that zoom to full size when you hover over them.
Change the percentage, to adjust the default width for such thumbnails.
The transition property is used to make the thumbnail zoom gradually (note: this won’t work in IE9 or earlier). Change the number, to adjust the duration of the transition.
Post or page editor
Upload and insert the image the normal way, selecting the full size option. (Naturally, the image you upload needs to be as wide as the main column of the theme you’re using, or wider.)
Delete the width and height from the image code, and add “zoom” to the image classes. In other words, turn the image code to this:
If you need to insert such thumbnails at varying widths, add the style attribute as well (change the percentage to adjust the width):
For a live example see this demo post. [Sorry, upgrade on that blog has expired]
Does it work if I don’t buy Custom Design package? Do you have any workaround with this awesome trick? :D
No, it’s not possible without the upgrade.
This is really cool. Do you know of anything like it (or like your mouseover popup) available as a plugin for a self-hosted wordpress blog?
Sorry, I don’t have any experience with self-hosted blogs. You can search here, and you’ll probably find more interesting effects: