JQuery淡入页面

Question

我有一堆HTML页面，它们是单独的文件，但我想在每个页面之间进行简单的淡入/淡出。

我使用了以下代码：

$("#content").css("display", "none");

$("#content").fadeIn(2000);

$("ul.menu li a").click(function(event){
    event.preventDefault();
    linkLocation = this.href;
    $("#content").fadeOut(1000, redirectPage);      
});

function redirectPage() {
    window.location = linkLocation;
}

我在这个阶段将它绑定到我的主菜单，内容是我的页眉和页脚之间的div（我不想应用效果）

但问题是，它有点闪烁，加上它会在消除之前短暂地显示内容，然后再次淡化它。

对此有更好/更简单的解决方案吗？

Answer 1

试试这段代码：

$("#content").css("display", "none");

$("#content").fadeIn(2000);

$("ul.menu li a").click(function(event){
    event.preventDefault();
    linkLocation = this.href;
    $("#content").fadeOut(1000, redirectPage);      
});

function redirectPage() {
    $("#content").css('visibility' : 0); // use to remove the content - it won't be diplayed
    window.location = linkLocation;
}