release_countdown.html 2.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394
  1. <!DOCTYPE HTML>
  2. <html>
  3. <head>
  4. <title>ESP32 Marauder Release</title>
  5. <meta name="viewport" content="width=device-width, initial-scale=1">
  6. <style>
  7. q {
  8. position: absolute;
  9. top: 50%;
  10. -ms-transform: translateY(-50%);
  11. transform: translateY(-50%);
  12. left: 50%;
  13. -ms-transform: translate(-50%, -50%);
  14. transform: translate(-50%, -50%);
  15. }
  16. p {
  17. position: absolute;
  18. top: 56%;
  19. -ms-transform: translateY(-50%);
  20. transform: translateY(-50%);
  21. left: 50%;
  22. -ms-transform: translate(-50%, -50%);
  23. transform: translate(-50%, -50%);
  24. text-align: center;
  25. font-size: 30px;
  26. color: white;
  27. font-family: courier new;
  28. padding-top: 10px;
  29. }
  30. body {
  31. background-color: black;
  32. }
  33. .countdown {
  34. padding-top: 5%;
  35. }
  36. </style>
  37. </head>
  38. <body>
  39. <div>
  40. <q>
  41. <a href="https://www.tindie.com/products/justcallmekoko/esp32-marauder/"><img src="https://github.com/justcallmekoko/ESP32Marauder/raw/master/pictures/marauder3L.jpg?raw=true" alt="marauder">
  42. </q>
  43. </div>
  44. <div>
  45. <p class="countdown" id="demo"></p>
  46. <script>
  47. // Set the date we're counting down to
  48. var countDownDate = new Date("Jun 1, 2021 15:00:00").getTime();
  49. // Update the count down every 1 second
  50. var x = setInterval(function() {
  51. // Get today's date and time
  52. var now = new Date().getTime();
  53. // Find the distance between now and the count down date
  54. var distance = countDownDate - now;
  55. // Time calculations for days, hours, minutes and seconds
  56. var days = Math.floor(distance / (1000 * 60 * 60 * 24));
  57. var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  58. var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
  59. var seconds = Math.floor((distance % (1000 * 60)) / 1000);
  60. // Output the result in an element with id="demo"
  61. document.getElementById("demo").innerHTML = days + "d " + hours + "h "
  62. + minutes + "m " + seconds + "s ";
  63. document.title = days + "d " + hours + "h "
  64. + minutes + "m " + seconds + "s ";
  65. // If the count down is over, write some text
  66. if (distance < 0) {
  67. clearInterval(x);
  68. document.getElementById("demo").innerHTML = "EXPIRED";
  69. }
  70. }, 1000);
  71. </script>
  72. </div>
  73. </body>
  74. </html>