☰

Clock figuccio

clock ore minuti secondi data

当前为 2019-11-04 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name        Clock figuccio
  3. // @description clock ore minuti secondi data
  4. // @version     1.1.4
  5. // @include     *
  6. // @author      figuccio
  7. // @grant       GM_setValue
  8. // @grant       GM_getValue
  9. // @grant       GM_registerMenuCommand
  10. // @icon        data:image/gif;base64,R0lGODlhEAAQAKECABEREe7u7v///////yH5BAEKAAIALAAAAAAQABAAAAIplI+py30Bo5wB2IvzrXDvaoFcCIBeeXaeSY4tibqxSWt2RuWRw/e+UQAAOw==
  11. // @namespace https://greasyfork.org/users/237458
  12. // ==/UserScript==
  13. /*inserire questo per disattivare alcune funzioni allinizio e alla fine del codice */
  14.  
  15. if (window.top != window.self) //eseguire solo su  frame principale (evita doppio dispay)
  16.     return;
  17.  
  18.  
  19.  const clockSettings = {
  20.   fontSize: '15px',
  21.   is12hour: false,
  22.   backgroundcolor:"red",
  23. }
  24.  
  25. function updateClock() {
  26.   let date = new Date();
  27.  
  28.   let time = date.toLocaleString('it',{
  29.       hour:'2-digit',minute:'numeric',second:'numeric',
  30.       day:'2-digit',year:'numeric',month:'long',weekday:'long',
  31.       hour12: clockSettings.is12hour
  32.   });
  33.   node.innerHTML = time;
  34. }
  35. let node = document.createElement('div');
  36. function setStyles(styles) {
  37.   styles.forEach(style => node.style.setProperty(style.name, style.value));
  38. }
  39. setStyles([
  40. { name: 'top', value: '0'},{ name: 'left', value: '0'},{ name: 'bottom', value: '' },//sopra
  41. //{ name: 'bottom', value: '0' },{ name: 'right', value: ''},//sotto
  42. { name: 'color', value: 'white' },{name: 'z-index', value: '99999' },{ name: 'position', value: 'fixed'},
  43. { name:'padding-top', value:'5px'},{name:'padding-right',value:'5px'},{name:'padding-bottom',value:'5px'},{name:'padding-left',value:'5px'},
  44. { name: 'border-radius', value: '10px' },{ name: 'border', value: '2px solid blue' },{ name: 'background-color', value:clockSettings.backgroundcolor },
  45. { name: 'margin',value: '0px 12cm'},{ name:'font-size',value:clockSettings.fontSize },
  46. ]);
  47.  
  48. document.body.appendChild(node);
  49. setInterval(() => updateClock(), 1000);
  50.             /* effetti speciali
  51. node.addEventListener("mouseover", function( event ) {
  52.     // evidenzia il bersaglio del mouseover
  53.     event.target.style.color = "orange";
  54.     event.target.style.background = "green";
  55.     event.target.style.border= "solid black";
  56. // ripristinare il colore dopo un breve ritardo
  57.     setTimeout(function() {
  58.     event.target.style.color = "white";
  59.     event.target.style.background = "red";
  60.     event.target.style.border = "solid blue";
  61.     }, 7000);
  62.   }, false);
  63. */
  64.  
  65.   //nasconde orario al click del mouse per 9secondi
  66. node.addEventListener("click", function( event ) {
  67. event.target.style.display= "none";
  68.  
  69. setTimeout(function() {
  70.       event.target.style.display= "block";
  71.     }, 9000);
  72.  
  73.   }, false);