ロード時のポップアップモーダルの遅延

Question

私はこのスクリプトが好きですが、JSには新しいので、「歓迎」挨拶を表示する前に5秒の遅延を追加する方法がわかりません。

var hasSeenGreeting = localStorage.getItem("greeting"); 

if(!hasSeenGreeting){ 
     document.getElementById("welcome").style.display = "block"; 
     localStorage.setItem("greeting", "true"); 
} 

document.querySelector(".button").addEventListener("click", function(){ 
    localStorage.removeItem("greeting", "true"); 
}); 

Answer 1

setTimeout（）を使用できます。 Here is a reference link。

setTimout(function() { 
    document.getElementById("welcome").style.display = "block"; 
    localStorage.setItem("greeting", "true"); 
}, 5000); // 5 second delay in ms. 

上記のコードでは、匿名関数をsetTimeout呼び出しに渡しています。その関数の中で、あなたのウェルカムdivの表示プロパティを設定するためのコードを実行しています。また、localStorageの値を設定します。

これを達成するもう1つの方法は、これらの呼び出しを独自の関数に組み込み、setTimeoutで呼び出すことです。例：

var showDiv = function() { 
    document.getElementById("welcome").style.display = "block"; 
    localStorage.setItem("greeting", "true") 
} 

setTimeout(showDiv, 5000); // 5 second delay in MS. 

Here is a JS Fiddle for reference

幸運！