jQuery不透明动画

Question

我正在创建一个网站，它允许用户更改视图选项。我使用jQuery来平滑动画以更改字体。它将整个页面淡出并重新使用新字体。

淡出动画很好，但当它淡入时，就没有褪色。它只是弹出，没有动画。

有问题的jQuery位于http://xsznix.my3gb.com/options.php。

到目前为止我的代码是：

$('#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

jQuery的.animate()取值从0到1。

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

我确信.animate()必须对您传递的值调用.parseFloat()（或其他内容），这会使0%成为0（这是100%正确），但你的100进入{{1}}，这是不正确的。

Answer 2

为什么不使用jQuery的内置函数fadeIn和fadeOut？

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

Answer 3

您可以使用以下功能：

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