Question

I have two images. I would like for the second image to fade-in when I ‘mouseover’ over the first image and fade-out when I ‘mouseout’ from the first image.

How can I acomplish this using css3?

I thank you in advance for your replies.

Answer 1

Actually I don’t know how to do this using CSS3, but using JQuery:

$('#image1').mouseover(function() {
  $('#image2').fadeIn();
});

$('#image1').mouseout(function() {
  $('#image2').fadeOut();
});

This is a basic solution for a few images, but you can do it dynamically depending on your needs.