swup - Swup JS 卡在“pageLoaded”状态
问题描述
您好,我正在尝试使用这个很棒的插件“Swup JS”。当我从他们的网站运行代码时,插件运行完美。
当我尝试将它添加到我的网站时,它停留在“pageLoaded”状态。
我试图删除所有代码并分别粘贴每个部分,但错误不断发生。基本上 URL 正在改变并且动画正在工作(直到淡出部分),但新内容永远不会加载。调试器插件显示它直到这部分“pageLoaded”没有任何错误。
有没有人使用过这个插件或发现这个错误?
解决方案
我遇到了同样的问题,并意识到这是由于“transition-fade”类动画没有正确应用于 HTML。这在以下文档常见问题中进行了介绍:缺少过渡类部分的样式。
要解决您的问题,请确保您的 swup 元素具有与其链接的动画类,并且您已在样式表中正确引用了动画。
.transition-fade {
transition: 0.4s;
opacity: 1;
}
html.is-animating .transition-fade {
opacity: 0;
}
推荐阅读
- javascript - 所有标签都在第一张幻灯片上(instagram 像用户标签)
- c# - 如何在.net中使现有的代码块异步?
- django - 自定义用户模型:请为员工帐户输入正确的电子邮件和密码。两个地方都要注意大小写
- javascript - 如何检查从我端触发的套接字事件?
- symfony - 如何为访客帐户启用 Sulu API?
- javascript - 当文本框输入带小数的值时,在第二个文本框上显示相同的值
- java - PowerMock(ito):如何测试私有方法并在另一个私有方法中模拟公共服务
- javascript - 为什么我会收到此错误 - 'TypeError: Can only call FormData.append on instances of FormData' 即使我只使用 FormData 的实例?
- visual-studio-code - VSCode 错误命令 'Live Server: Open with Live Server' 导致错误(找不到命令'extension.liveServer.goOnline')
- javascript - 模态图像网格