Jquery fadein和out

Question

检查出来：http://novarose.co.cc/web2/

淡化效果有点混乱，我不知道如何让它正常工作。

我希望代码按以下顺序运行：

1. 淡出块
2. 插入新内容
3. 淡入

该页面的jQuery代码：

$（'＃navigation a'）。click（function（）{     $ .get（“page.php”，{page：$（this）.attr（'id'）}，function（data）{         。$（ '＃内容'）淡出（ '慢'）HTML（数据）.fadeIn（ '慢'）;     }）; }）;

Answer 1

您的问题出在此处：$('#content').fadeOut('slow').html(data).fadeIn('slow'); }); 这会在fadeIn完成之前启动fadeOut。你想这样做：

$('#content').fadeOut('slow', function(){
  $(this).html(data).fadeIn('slow')
});

fadeOut的第二个参数是fadeOut完成后被称为的函数。

Answer 2

你可以在ajax调用之前将淡出移动到：

$('#navigation a').click(function(){ $('#content').fadeOut('slow'); $.get("page.php", { page: $(this).attr('id') },
    function(data){ $('#content').html(data).fadeIn('slow'); }); });