-
Posts
-
Hi,
Is it possible to create a roll over image in page sidebar?
I have 2 images ready, same dimensions.Thanks
Hey robertscott!
If you link your image it should display rollover effect automatically. Maybe i did not understand what exactly you are asking. Can you post a link to an example please?
Cheers!
YigitSorry to wake up this old post… but I don’t understand your answer to Robert’s question and can’t find another easy way to do that simple effect :
How to make a rollover effect with 2 same-size-images ?The best way would be to have an option in the media/image toolbox or create a “image rollover” in the same section… but you talk about an automatic option… what’s that ?
Or maybe you can make a quick css tutorial please ?Hi,
Are you looking for this kind of image rollover effect?
// https://codepen.io/CF-251/pen/veXdVx
Best regards,
IsmaelHi energiesgraphiques,
Add a Code Block (under Content Elements), then add this code:
<div style='display: flex; justify-content: center;'> <a href="#" class="noLightbox"> <img src="https://website.com/wp-content/uploads/2022/06/image.jpg" onmouseover="this.src='https://website.com/wp-content/uploads/2022/06/hover_image.jpg'" onmouseout="this.src='https://website.com/wp-content/uploads/2022/06/image.jpg'" /> </a> </div>then replace http://website.com/wp-content/uploads/2022/06/image.jpg with the current image you want to use and replace http://website.com/wp-content/uploads/2022/06/hover_image.jpg with the hover image you want to use.
Hope this helps.Best regards,
Nikkothanks, that works (not on my firefox, but edge accept it !).
but I still think this should be an image option, so we can keep some sort of ‘wysiwyg’ view of what we’re doing. There is actually a mouseover option in the image/advanced/animation section… too bad we get only a zoom in/out option in there.Thanks anyway !
- You must be logged in to reply to this topic.