Computer >> कंप्यूटर ट्यूटोरियल >  >> प्रोग्रामिंग >> JavaScript

जावास्क्रिप्ट के साथ उलटी गिनती टाइमर कैसे बनाएं?

<घंटा/>

जावास्क्रिप्ट के साथ काउंटडाउन टाइमर बनाने के लिए, कोड इस प्रकार है -

उदाहरण

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<style>
   body {
      font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
   }
   .timer {
      text-align: center;
      font-size: 60px;
      margin-top: 0px;
      color: white;
      background-color: rgb(100, 38, 214);
   }
</style>
</head>
<body>
<h1 style="text-align: center;">Countdown Timer Example</h1>
<h2 class="timer"></h2>
<script>
   var countDownDate = new Date("June 5, 2022 11:27:15").getTime();
   var timeClear = setInterval(function() {
      var now = new Date().getTime();
      var timeLeft = countDownDate - now;
      var days = Math.floor(timeLeft / (1000 * 60 * 60 * 24));
      var hours = Math.floor(
         (timeLeft % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)
      );
      var minutes = Math.floor((timeLeft % (1000 * 60 * 60)) / (1000 * 60));
      var seconds = Math.floor((timeLeft % (1000 * 60)) / 1000);
      document.querySelector(".timer").innerHTML = days + "d " + hours + "h " + minutes + "m " + seconds + "s ";
      if (timeLeft < 0) {
         clearInterval(timeClear);
         document.querySelector(".timer").innerHTML = "Timer Finished";
      }
   }, 1000);
</script>
</body>
</html>

आउटपुट

उपरोक्त कोड निम्न आउटपुट उत्पन्न करेगा -

जावास्क्रिप्ट के साथ उलटी गिनती टाइमर कैसे बनाएं?


  1. जावास्क्रिप्ट के साथ सिंटेक्स हाइलाइटर कैसे बनाएं और उपयोग करें? जावास्क्रिप्ट के साथ सिंटेक्स हाइलाइटर कैसे बनाएं और उपयोग करें?

    वाक्यविन्यास बनाने और उपयोग करने के लिए, कोड इस प्रकार है - उदाहरण body { font-family:Segoe UI, Tahoma, Geneva, Verdana, sans-serif; } .colorLinks {रंग:rgb(131, 44, 212); पाठ-सजावट:कोई नहीं; फ़ॉन्ट-आकार:20px; फोंट की मोटाई:बोल्ड; } .setColor { मार्जिन:20px; पैडिंग:10px; सीमा:कोई नहीं; फ़ॉन्ट-आकार:1

  1. जावास्क्रिप्ट के साथ टाइपिंग इफेक्ट कैसे बनाएं? जावास्क्रिप्ट के साथ टाइपिंग इफेक्ट कैसे बनाएं?

    JavaScript के साथ टाइपिंग इफेक्ट बनाने के लिए, कोड इस प्रकार है - उदाहरण <!DOCTYPE html> <html> <head> <style>    body{       font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;    }    button{      

  1. जावास्क्रिप्ट में स्थिरांक कैसे बनाएं? उदाहरण सहित स्पष्ट कीजिए। जावास्क्रिप्ट में स्थिरांक कैसे बनाएं? उदाहरण सहित स्पष्ट कीजिए।

    जावास्क्रिप्ट में स्थिरांक बनाने के लिए निम्नलिखित कोड है - उदाहरण <!DOCTYPE html> <html> <head> <style>    body {       font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;    } </style> </head> <body> &