jquery - 动画不透明度，插入 html，动画不透明度

Question

使用我的jquery，我试图通过将消息的不透明度动画化，插入loading.gif 并将不透明度动画化回来，使从消息到加载函数的转换在眼睛上变得容易。它失败了。

$('#powerSearchSubmitButton').click(function(ev) {
    startLoad();
    return false;
});
function startLoad() {
    $('.message').each(function(i) {
        $(this).animate({opacity: 0}, 500, function() {
            $(this).html("<img src=\"/content/pics/loadingBig.gif\" alt=\"loading\" style=\"opacity:0\"/>");
            $(this).animate({opacity: 1},500);
        });
    };
    return true;
};

当我省略 .html() 调用时，它工作正常(当然图像不在那里；所以我认为这是因为 html 没有插入 opacity:0; 但是当我用 style="opacity:0" 插入它时，它无法淡入……

我做错了什么？

Answer 1

试试这个:

$(this).fadeOut(500, function() {
     $(this).html("<img src='content/pics/loadingBig.gif' alt='loading'/>");
    });
$(this).fadeIn(500);