shows time

shows the time in every website and can be dragged any where

当前为 2024-02-03 提交的版本,查看 最新版本

  1. // ==UserScript==
  2. // @name shows time
  3. // @namespace http://tampermonkey.net/
  4. // @version 1.1
  5. // @description shows the time in every website and can be dragged any where
  6. // @author Bibek
  7. // @match https://*/*
  8. // @icon https://purepng.com/public/uploads/medium/purepng.com-clock-iconsymbolsiconsapple-iosiosios-8-iconsios-8-721522596027cnipp.png
  9. // @grant none
  10. // @license MIT
  11. // ==/UserScript==
  12.  
  13. (function() {
  14. 'use strict';
  15. // your code starts here 👇👇👇
  16.  
  17.  
  18. // Create a container for the time display
  19. const timeContainer = document.createElement('div');
  20. timeContainer.style.position = 'fixed';
  21. timeContainer.style.top = '0';
  22. timeContainer.style.left = '0';
  23. timeContainer.style.backgroundColor = '#4e2bda';
  24. timeContainer.style.padding = '5px';
  25. timeContainer.style.border = '1px solid #3300ff8a';
  26. timeContainer.style.cursor = 'move';
  27. timeContainer.style.borderRadius = '8px'; // Add border radius
  28. timeContainer.style.zIndex = '9999'; // Set z-index to a high value
  29. timeContainer.style.color = '#f7f7f7'; // Set text color
  30. timeContainer.style.fontWeight = 'bold'; // Set font weight
  31. // timeContainer.style.background = 'linear-gradient(to right, #ff8c00, #ff0000)';
  32. // timeContainer.style.animation = 'gradient 8s ease infinite';
  33.  
  34. // Create a span for the current time
  35. const currentTime = document.createElement('span');
  36. timeContainer.appendChild(currentTime);
  37.  
  38. // Append the container to the body
  39. document.body.appendChild(timeContainer);
  40.  
  41. // Update the time every second
  42. function updateTime() {
  43. const now = new Date();
  44. let hours = now.getHours();
  45. const minutes = now.getMinutes();
  46. const seconds = now.getSeconds();
  47.  
  48. // Format the time in 12-hour clock format
  49. const ampm = hours >= 12 ? 'PM' : 'AM';
  50. hours = hours % 12 || 12;
  51.  
  52. // Format the time as HH:MM:SS AM/PM
  53. const formattedTime = `${hours < 10 ? '0' : ''}${hours}:${minutes < 10 ? '0' : ''}${minutes}:${seconds < 10 ? '0' : ''}${seconds} ${ampm}`;
  54.  
  55. // Update the time text
  56. currentTime.textContent = formattedTime;
  57. }
  58.  
  59. // Make the time container draggable
  60. dragElement(timeContainer);
  61.  
  62. // Update the time initially and set an interval to update it every second
  63. updateTime();
  64. setInterval(updateTime, 1000);
  65.  
  66. // Function to make an element draggable
  67. function dragElement(elmnt) {
  68. let pos1 = 0, pos2 = 0, pos3 = 0, pos4 = 0;
  69. elmnt.onmousedown = dragMouseDown;
  70.  
  71. function dragMouseDown(e) {
  72. e.preventDefault();
  73. pos3 = e.clientX;
  74. pos4 = e.clientY;
  75. document.onmouseup = closeDragElement;
  76. document.onmousemove = elementDrag;
  77. }
  78.  
  79. function elementDrag(e) {
  80. e.preventDefault();
  81. pos1 = pos3 - e.clientX;
  82. pos2 = pos4 - e.clientY;
  83. pos3 = e.clientX;
  84. pos4 = e.clientY;
  85. elmnt.style.top = (elmnt.offsetTop - pos2) + 'px';
  86. elmnt.style.left = (elmnt.offsetLeft - pos1) + 'px';
  87. }
  88.  
  89. function closeDragElement() {
  90. document.onmouseup = null;
  91. document.onmousemove = null;
  92. }
  93. }
  94.  
  95.  
  96.  
  97.  
  98.  
  99.  
  100.  
  101.  
  102.  
  103. // your code ends here 👆👆👆
  104. })();