浏览器后退按钮位置问题

Question

当我链接到子页面时，我有以下脚本用于平滑淡入、淡出。

$("body").css("display", "none");
$("body").fadeIn(500);

$('a').click(function(event){
    event.preventDefault();
    linkLocation = this.href;
    $("body").fadeOut(500, redirectPage);       
});

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

效果很好。奇怪的是，浏览器的后退按钮有问题。假设我在我的index.html 上并单击链接到about.html 的链接，然后尝试通过返回按钮返回index.html，它显示的只是一个空白页面。需要手动刷新。

为了让我的问题更清楚，您可以找到一个示例 HERE

注意：我在 Firefox 和 Safari 下遇到了这个问题。 Chrome 好像没问题。

Answer 1

这是由于浏览器特殊的“后退/前进”缓存，它存储了页面的完整状态。

您可能希望在pageshow 事件中添加fadeIn。

详情请看这个答案：

https://stackoverflow.com/a/2218733/3527940