Advertisement
jcunews

SimpleClock.hta

Mar 25th, 2022
760
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <!--
  5. Simple Clock, March 2022.
  6. https://www.reddit.com/user/jcunews1
  7. https://pastebin.com/u/jcunews
  8. https://greasyfork.org/en/users/85671-jcunews
  9. -->
  10. <meta charset=utf-8 />
  11. <meta http-equiv="x-ua-compatible" content="IE=9" />
  12. <title>Simple Clock</title>
  13. <style>
  14. /*
  15. To change the font, change the `font-family` style.
  16. Do not change the `font-size` style, since it is used for auto font size.
  17. */
  18. html,body{margin:0;overflow:hidden;background:#555;color:#aaa;font-size:20px;font-family:'Lucida Console',monospace}
  19. #clock{display:table-cell;vertical-align:middle;width:100vw;height:100vh;text-align:center}
  20. #temp{display:inline-block;position:absolute;top:-200vw}
  21. </style>
  22. </head>
  23. <body>
  24. <div id=clock></div>
  25. <div id=temp style="font-size:20px">00:00:00</div>
  26. <script>
  27. fs = 20;
  28. (onresize = function() {
  29.   if (temp.offsetWidth < innerWidth) {
  30.    for (i = fs; temp.offsetWidth <= innerWidth; i++) {
  31.      temp.style.fontSize = i + "px";
  32.    }
  33.    temp.style.fontSize = (fs = (i - 2)) + "px";
  34.  } else if (temp.offsetWidth > innerWidth) {
  35.     for (i = fs; temp.offsetWidth >= innerWidth; i--) {
  36.       temp.style.fontSize = i + "px";
  37.     }
  38.     temp.style.fontSize = (fs = (i + 1)) + "px";
  39.   }
  40.   clock.style.fontSize = fs + "px";
  41. })();
  42. setInterval(function() {
  43.   d = new Date;
  44.   clock.textContent = ("0" + d.getHours()).substr(-2) + ":" +
  45.     ("0" + d.getMinutes()).substr(-2) + ":" +
  46.     ("0" + d.getSeconds()).substr(-2);
  47. }, 100);
  48. </script>
  49. </body>
  50. </html>
  51.  
Advertisement
RAW Paste Data Copied
Advertisement