0

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このようにして、ロードは遷移と同時に開始されます。ただし、遷移が終了していなくても、ページはいつでも変更されます。

私がやりたいことをする方法はありますか?またはこれに似たもの。

4

0 に答える 0