fading in my image gallery

I have an 开发者_运维技巧image gallery and I want to add fade effect, How can I do do this in this code?

$(document).ready(function() {
$(".gallery div").mouseover(function(){
    $(".gallery div").removeClass("current");
    $(this).toggleClass("current");
});
 }); 

Thanks in advance

Use the fade effect.

You can do fadeIn, fadeOut or fadeTo depending on what you need :

$("p:first").click(function () {
  $(this).fadeTo("slow", 0.33);
});

$(document).ready(function() {
$(".gallery div").hover(function(){
    $(".gallery div").removeClass("current").fadeOut('fast');
    $(this).toggleClass("current").fadeIn('fast');
});
 }); 

Something like this, fades out on mouseout, fades in on hover?

$(document).ready(function() {
  $(".gallery div").mouseover(function(){
    $(".gallery div").removeClass("current").fadeTo(500, 0.25);
    $(this).toggleClass("current").stop().fadeIn(200);
  });
});

You can also do this via the hover() function:

$(document).ready(function() {
  $(".gallery div").hover(function(){
    $(this).addClass("current").stop().fadeIn(200);
  }, function() {
    $(this).removeClass("current").fadeTo(500, 0.25);
  });
});