Web サイトでページ遷移を使用しています。しかし、私の現在のやり方は最も効率的ではありません。
ユーザーがリンクをクリックすると、トランジションがトリガーされ、 でページが変わりますwindow.location
。
私がやりたいことは、次のページの読み込みを開始してから遷移をトリガーすることです。次のページが読み込まれたら、ページを離れる前に outTransition が完了したことを確認する必要があります。
まとめると、2つのステップ(トランジションと次のページの読み込み)を交互に行うのではなく、同時に行いたいと考えています。
私の現在のコード:
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
このようにして、ロードは遷移と同時に開始されます。ただし、遷移が終了していなくても、ページはいつでも変更されます。
私がやりたいことをする方法はありますか?またはこれに似たもの。