使用本机浏览器上一个/下一个按钮时，页面转换挂起

Question

在使用本机浏览器上一个/下一个按钮时，我遇到了一个奇怪的行为。当导航到一个页面并返回到上一个页面时，转换不会消失。它只是挂在屏幕上，直到我刷新页面。

有趣和令人沮丧的是，它有时在同一台设备上工作，有时不在同一个设备上。大多数情况下，它在Chrome(桌面(和移动设备(iOS、Android(上都有问题。如果它在桌面上工作，那么它可能在手机上不工作，反之亦然。我还在朋友的设备上测试了很多，不出所料，其中一些有效，有些无效。

我怀疑"；点击链接"；部分但我不知道那里出了什么问题(我希望有人能帮助我。

// Wait until the whole page is loaded.
$(window).on("load", function () {
hideLoad(); // call out animations.
});

// Transitions In
// =================
function revealLoad() {
$("#page-transition").removeClass("tt-transition-out");
$("#page-transition").addClass("tt-transition-in");
}
// Transitions Out
// ================
function hideLoad() {
$("#page-transition").addClass("tt-transition-out");
}
// On link click - I suspect a problem may be in this section
// ==============
$("a").on('click', function(e) {
e.preventDefault();
setTimeout(function (url) {
window.location = url
}, 1500, this.href);
revealLoad(); // call in animations.
});

代码笔：https://codepen.io/mrWilson123/pen/VwrXebj

你可以在这里现场测试。

Answer 1

这可能会对您有所帮助，请使用$(document).ready(function(){})而不是$(window).on("load", function () {})因为你有一些图像和CCD_ 3触发器在每个东西都被加载之后。

更多解释：https://stackoverflow.com/a/3698214/11143288

Answer 2

下面的代码似乎成功了。：(

window.onpageshow = function (event) {
if (event.persisted) {
window.location.reload();
}
};

来源：https://stackoverflow.com/a/13123626/2785140

谢谢，@mostafa。：(