Fade hover effect for images
V
Vladimir Poskrebyshev
I know you can make rollover images by uploading two images. I have another idea which might be useful if you don't have time to produce separate images but still want to add some interactiveness to your images with links: Add fade effect on hover. I think it would make sense in case when your picture:
1) Does have an assigned link
2) Do not have any rollover images
It makes sense to allow activating this option once users add links to images. It adds interactiveness and shows email subscribers that this image is clickable which increases click rates.
.fade{ transition: 0.5s !important; }
.fade:hover{ transition: 0.5s !important; opacity: 0.8 !important;}
Transition time and opacity level can be set as variable. So in the editor it will look like this:
1) Added some link to the picture
2) Switcher appears Image fade hover effect
3) If activated, two parameters appear: animation time and Opacity level. I would keep it simple and make both from 0.0 to 1.0 using a + and - controllers
4) If transition is set to 0, effect does not appear in CSS
This setup makes sense to me but you might think differently. For example, maybe it can be added without "has link" limitation, maybe somebody wants to have this effect even when picture is not clickable. But to me it does not make sense. Additionally, there might be some other effect but I only checked behaviour of "fade" in a couple of email clients (Gmail - works correctly, Outlook - does not work. But buttons' hover effect is also not perfect in Outlook).
Opacity: supported by 63% of email clients (https://www.caniemail.com/search/?s=opacity)
Transition: by 21-39% (https://www.caniemail.com/search/?s=transition)
M
Marina Kryvenets
Hello, Vladimir!
Thank you for your idea and support in enhancing the platform.
I've forwarded your request to the development team.
We appreciate your participation!