I am trying to complete a photography website and wish to feature before and after images. Is there a good way to create a rollover or hover in the Enfold theme? I want to show the original picture and then hover to show the new and improved picture.
You can add HTML as following
<img onmouseover="this.src='path-to-mouse-over-image';" onmouseout="this.src='path-to-normal-image';" src="path-to-normal-image" alt="what-ever-you-like" />
It would be a lot easier if you use one of “before/after” plugins
I tried to use the code but after saving it always converts to a regular image, not only in the appearance but also code-wise. Do you know what I can do?
Please use code block element or text tab on text block element.
In the text blog the code always changes to a regular image after saving. In the code block it stays.
When I tried it before the effect wasn´t there. Now I have the image rollover effect but when I want to make the image clickable the “icon hover effect” seems to interfere with the changing image. So it doesn´t work with clickable images right now. And the code is still changing in text blocks.
please search for a “before/after” plugin as Yigit already mentioned.
Can you recommend any specific plugin? I´ve tried several and nothing is working with clickable images. Even removed the regular icon hover effect via quick css. Still not working.
The topic ‘Create Rollover Images’ is closed to new replies.