javascript - 訪問者が一定時間ページにアクセスした後にのみ表示されるポップアップを作成するにはどうすればよいですか？

Question

邪魔にならない「ニュースレターにサインアップ」ポップアップを作業中のWebサイトに追加しようとしていますが、ユーザーがWebサイトに3時間以上アクセスした後にのみポップアップを表示したいと思います。分かそこら。誰かが私がこれを達成するのを手伝ってくれるなら、それは素晴らしいことです。

みなさん、よろしくお願いします

Answer 1

そうです、考慮すべきことがいくつかあります。ポップアップ表示属性、ポップアップを表示する関数、および関数が起動するまでに経過する必要のある時間。

<style>
 .SignupPopup{display:none}
</style>


<!-- Page HTML -->
<div id="SignupPopup" class="SignupPopup"></div>



<script>

  // Function that displays your popup
  function popSignupForm(){
     document.getElementById('SignupPopup').style.display = 'block';
  }

  // Using setTimeout to fire the popSignupForm function
  // in 3 minutes time (this is done in milliseconds)
  setTimeout( function(){
     popSignupForm();
  }, 180000 );

</script>

これは、ユーザーが同じページに3分間留まっている限り機能します。サイトに3分後にポップアップを表示する場合は、Cookieを作成し、ユーザーが最初にサイトにアクセスしたときにタイムスタンプを付ける必要があります。次に、x間隔ごとに（タイムスタンプから）経過秒数を測定して、ニュースレター登録フォームをポップアップする時間が表示されるかどうかを確認できます。

疑似は次のようになります。

function onPageLoad(){

     If Cookie Doesn't exist for your site
        Create Cookie
        Record Timestamp


     //Start Checking the cookie to see if 
     //it's time to show the popup
     checkCookieTime()

}

function checkCookieTime(){

    // Check to see if at least 3 minutes
    // Have elapsed from the time of the cookie's
    // cookie's creation
    If Now is >= (Cookie.TimeStamp  + 3 minutes )
      popSignupForm()
    Else
      // Check again in 10 Seconds
      setTimeout( function(){
        checkCookieTime()
      }, 10000 );

}

これは、 Cookieの読み取り/書き込みに関するquirksmodeの優れた記事です。

Answer 2

javascriptでsettimeoutfunctionを使用できます

setTimeout(function(){},time);