jQuery animación de opacidad

Question

Estoy creando un sitio web y permite a los usuarios cambiar las opciones de visualización. Uso jQuery para suavizar las animaciones para cambiar las fuentes. Se desvanece toda la página y vuelve a entrar con las nuevas fuentes.

La animación de fundido está bien, pero cuando vuelve a fundirse, no hay fundido. Simplemente aparece, sin animación.

La problemática jQuery está en http://xsznix.my3gb.com/options.php.

El código que tengo hasta ahora es la siguiente:

$('#font-classic').click(function(){ 
    $(document.body).animate({opacity: '0%'},{duration: 1000, complete: function(){ 
     // font changing code here 
     $(document.body).animate({opacity: '100%'}, 1000); 
    }}); 
}); 

Answer 1

Por qué no usar jQuery 's funciones integradas fadeIn y fadeOut?

$('#font-classic').click(function(){ 
    $('body').fadeOut('normal', function(){ 
     $('body').fadeIn(); 
    }}); 
}); 

Answer 2

jQuery de .animate() toma valores 0-1.

$(document.body).animate({opacity: 0}, 1000); 
$(document.body).animate({opacity: 1}, 1000); 

Estoy seguro de que debe llamar .animate().parseFloat() (o algo así) en los valores que está pasando, lo que haría que su 0% en 0 (lo cual es correcto), pero su 100% en 100, lo que sería incorrecto.

Answer 3

Puede utilizar funciones o menos así:

$(document.body).animate({ opacity: 1/2 }, 1000);