additional info on hover

Hi all,

On this page www.ostraining.com/about/us/ (for example) there is additional info when you hover on the image. I guess it is using jQuery and mouseover. Is there any tutorial for how to do this or if not can anyone show me how to do it (eg on codepen.io )

Thanks...

Valentin wrote: Hi Juc2,

That effect is made thanks to CSS. I can create a tutorial for you to explain how to do it.
What do you think?

Kind regards,
Valentín

@Valentin yes please, thank you...

Valentin wrote: Hi Juc2,
The tutorial is ready: www.ostraining.com/blog/coding/transition-and-transform-css3/

Let us know if we can help you in something else

Kind regards,
Valentín

@ Valentin ok thanks. I will try the tutorial on my site and report back.

Thanks...

Yes this works fine thank you. Would this method also work if I want to swap the original image for another image (of the same size) on hover?

Thanks...

Nick wrote: Hi Juc2,

Great! We're glad it works for you!

Yes, the same method would work. But, you'd have to adjust the HTML and CSS slightly since it's no longer for a set caption, but rather the whole image is being switched.

Kind regards,
Nick

@ Nick yes it works, thanks! Is this CSS3, I mean are there any browser compatibility issues?

@ Valentin ok thanks...