CODEWITHSUNDEEP
jquery
nombre
nombre

Reputation: 71

Transition From Black and White to Color?

I have an icon that's in black and white, and I want the icon to transition to the color icon (as a crossfade) during the hover event. How can I do this in jQuery? #stumped.

Thanks!

Upvotes: 7

Views: 1215

Answers (2)

Hollister
Hollister

Reputation: 3918

How about fading one in and the other out?

$(function(){
  $('#coloricon').hide();

  $("#bwicon").hover(function(){ 
    $('#bwicon').fadeOut('slow');
    $('#coloricon').fadeIn('slow');
  });
});

<img id="bwicon" src="bw.png" style="position:absolute;top:50;left:50;">
<img id="coloricon" src="color.png" style="position:absolute;top:50;left:50;">

Upvotes: 0

Halil &#214;zg&#252;r
Halil &#214;zg&#252;r

Reputation: 15945

An example is here : Greyscale Hover Effect w/ CSS & jQuery

Upvotes: 1

Related Questions