カスタムカウントダウン

私がダウンロードしたカウントダウンテンプレートで発生したバグを見つけたとき、ここではcountdown テンプレートが使用すること.私は、代わりに単純なカウントダウンスクリプトを書き直すことを考えています.私が見つけたエラーは、数日で異なりました、一方、私は月と日の説明を必要としました.

HTML

 <div class="col-12 justify-content-end d-flex">
   <div class="col-md-9">
     <div class="countdown-timer mb-100 wow fadeInUp" data-wow-delay="300ms">
        <!-- <div id="clock"></div> -->
          <div id="clock">
           <div>1<span>Bulan</span></div>
           <div>8<span>Hari</span></div>
           <div>9<span>Jam</span></div>
           <div>51<span>Menit</span></div>
           <div>50<span>Detik</span></div>
          </div>
      </div>
   </div>
</div>

スクリプト

これは、スクリプトを修正することによって作られたスクリプトですw3school . 私はちょうど月のコンテンツを追加しました.

// Set the date to be counted down
var countDownDate = new Date("2020/10/10").getTime();

// Update the count down every 1 second
var x = setInterval(function() {

    // Get today's time in milliseconds
    var now = new Date().getTime();

    // Make up the distance between the current time and the countdown
    var distance = countDownDate - now;

    // Calculate time in months, days, hours, minutes and seconds
    var month = Math.floor(distance / (1000 * 60 * 60 * 24 * 30))
    var days = Math.floor((distance % (1000 * 60 * 60 * 24 *30)) / (1000 *60 * 60 * 24));
    var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
    var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
    var seconds = Math.floor((distance % (1000 * 60)) / 1000);

    // display result to container with id "clock"
    document.getElementById("clock").innerHTML = "<div>" + month + "<span>Bulan</span></div><div>" + days + "<span>Hari</span></div> <div>" +hours + "<span>Jam</span></div> <div>" + minutes + "<span>Menit</span></div> <div>" + seconds + "<span>Detik</span></div>";

    // when the countdown is complete, provide a text caption
    if (distance < 0) {
    clearInterval(x);
    document.getElementById("clock").innerHTML = "EXPIRED";
    }
// cross check
 console.log(month);
}, 1000);

良い時間を参照してくださいTania Rascia

数学討論

スクリプトから、私たちは、距離が時間(ミリ秒単位で)の結果であることを見ることができます.演算子を使用して% または剰余は、剰余を生成することによって分割を意味する2番目のデータを生成したいときに、距離は1000 * 60 , これは1000をミリ秒から秒に変換し、60分を秒単位で変換することを意味します1000 * 60 ) 分けられる1000 残りの秒を確認します.などの分、時間、日、月の治療のため.
の操作days and month 部品は、実際に1ヶ月＝30日という操作番号30のうちの1つを持っています.これは、詳細月を使用することによって将来的に改善されます.我々が知っているので、すべての月は30日を持ちません.
完了