我在我的网站上使用页面转换。然而,我目前的做法并不是最有效的。
当用户点击链接时,会触发转换,然后我使用 window.location
更改页面。
我想做的是启动下一页的加载,然后触发转换。一旦加载了下一个页面,我应该检查一个条件,即在我们离开页面之前完成了 outTransition。
总而言之,我不想一个接一个地执行两个步骤(转换和加载下一页),而是同时执行。
我当前的代码:
document.querySelector('a').addEventListener('click', (e)=>{
e.preventDefault();
var url = document.querySelector('a').getAttribute("href");
document.querySelector('.transition-overlay').classList.toggle("active");//trigger the transition
setTimeout(function(){
window.location = url;//to change page
},1000);
});
可以这样做吗?我在调用 setTimeout()
方法时尝试删除 window.location
函数。通过这种方式,加载开始的时间与转换的时间相同。但是页面会随时更改,即使转换并未结束。
有没有办法做我想做的事?或者类似的东西。