The plugin integrates seamlessly into the “Image” and “Text w/image” content elements. To use it, just insert an Image like you would normally do.
In the Media section of the content configuration, you now have three new fields at the bottom (above image options):
Enable Mouse Over Effects
Image Effect as Highlight Effect
Use Overlay Images
unless the you check “Enable mouse over effects” the extension does nothing and you can insert your normal images like always.
Once you checked that box, you can choose if you would like a highlight effect using typo3's standard image effects (screenshot 1 and 2 in the introduction), or if you want to use an overlay image to create a “revealing” effect (screenshot 3 in the introduction.
If you check this box, you will get the normal image in the frontend like before. However, if you move the mouse over the image, it will change according to the image effect you set. The default is to brighten the image (this effect will be used even if you don't set an effect at all). But you can use any of the other effects you like (Darken, Rotate, Grayscale also give nice effects).
I.e. if you select rotate 90 CW as effect, the images will rotate 90 degrees clockwise on mouse over.
These effects do not affect the original image, however. Therefore this still works well together with the “click enlarge” option.
This option is only available if “Image Effect as Highlight Effect” is not checked!
In this field you can upload any number of image files. These images will be shown instead of the original images until the mouse is over the image. The images will be taken in the order they appear in the input box. You can rearrange them at will with the two little arrows to the right of the box. If you upload less overlay images than original images, the last overlay image will be repeated, until all images are covered. This means, that if you upload only one image, all original images will be overlayed with this one image. This creates a nice “revealing” effect like turning cards around to see whats on the other side.


