Jquery - Ajout fadeIn/fadeOut à une fonction addClass de vol stationnaire

Question

Alrighty donc voici mon code actuel jquery qui, vol stationnaire de div « fbox » remplace un fond en changeant la classe pour la div « fbot »

<script> 
$(document).ready(function() { 
$(function() { 
    $("#fbox").hover(function() { 
     $("#fbot").addClass("fboto"); 
    }, 
    function() { 
     $("#fbot").removeClass("fboto"); 
    }); 
}); 
}); 



</script> 

maintenant ce que je veux est d'ajouter fadeIn et fadeOut à l'arrière-plan changeant mais je ne suis pas sûr de la bonne façon de le faire, je l'ai essayé quelques différents arrangements et cela a fonctionné tout simplement pas dans la direction ou de l'ordre que je voulais qu'il ..

Mon html pour les dIV:

<div id="fbox"> 
<div id="ftop"></div> <!-- top of fullbox --> 



<!-- middle of fullbox --> 
<div id="fmid"> 
<!-- content for the fullbox goes BELOW here --> 


<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 
<br /> 


<!-- content for the fullbox goes ABOVE here --> 
</div> 
<!-- end middle of fullbox --> 



<div id="fbot" class="fbot"></div> <!-- bottom of fullbox --> 

</div> 

Mon simple, pour l'image css de fond pour changer ..:

.fboto { 
    width: 934px; 
    background:url(images/cb/fboto.png) no-repeat; 
    height: 17px; 
    margin:0 
} 

Toute aide serait génial, merci!

Answer 1

jQuery UI vous permet d'animer l'ajout et la suppression des classes. Tout simplement en incluant le plugin jQuery UI que vous pouvez faire:

$("#fbot").addClass("fboto",duration,callBack); 
$("#fbot").removeClass("fboto",duration,callBack); 

Pour d'autres références: jQuery UI addClass