Ein Extra-Button mit dieser Funktion würde für mich eher nicht in Frage kommen, u. U. schon ein hover auf die js-Uhr die einige (auch ich) in einer Leiste haben.
Das passt nur bedingt zum Thema, deshalb:
Spoiler anzeigen
Es gibt ja verschiedene Uhren-Scripte, hier mal 'meins' mit Modal-Dialog:
JavaScript(function() { if (!window.gBrowser){ return; } function doDatClock() { let date = new Date(); var days = ['So', 'Mo', 'Di', 'Mi', 'Do', 'Fr', 'Sa']; var day = days[date.getDay()]; let timestr = day + ' - ' + date.toLocaleDateString(locale, { day: '2-digit', month: '2-digit', year: '2-digit'}) +' - ' + date.toLocaleTimeString(locale, { hour: '2-digit', minute: '2-digit'}); if( count == 1 ) { var counter = new Date( 2000 * sec ).toISOString().substr( 11 , 8 ); // .replace(/^[0:]+/, '') // if you want to replace zeroes and colons timestr = counter + ' 🕛️ ' + timestr ; sec++; } ClockLabel.setAttribute( 'value', timestr ); } var count = 1; // if you don't want a counter set this to zero var agent = 0; // if you just want the clock set this to zero var language = 'de-DE'; // locale, e.g. 'de-DE' , 'en-US' , 'fr-FR' var personalText = ' - Design\u00A9\u00A9'; // your personal text here var cssFontFamily = ''; var cssColor = 'lightgray'; // Font Color var css = 'padding-top: 2px; padding-left: 0; padding-right: 0; margin-right: 6px; color: ' + cssColor + '; font-family: ' + cssFontFamily + '; font-weight:normal; font-size:13px; text-shadow: none; width: 190px;'; var cssA = 'width: auto;'; var sec = 0; var locale = language || window.navigator.languages[0]; var position = document.getElementById('PlacesChevron'); var ClockLabel = document.createXULElement('label'); ClockLabel.setAttribute('id', 'statusbar-clock-display-1'); ClockLabel.setAttribute('class', 'statusbarpanel_c-text-1'); ClockLabel.setAttribute('style', css); position.parentNode.insertBefore(ClockLabel, position.nextSibling); if( agent == 1 ) { var AgentLabel = document.createXULElement('label'); AgentLabel.setAttribute('id', 'statusbar-agent-display-1'); AgentLabel.setAttribute('class', 'statusbarpanel_a-text-1'); AgentLabel.setAttribute('style', css + cssA); var FFstr = window.navigator.userAgent.split(' '); var FF = FFstr[FFstr.length-1].replace( '/' , ' ' ); // var text = 'Firefox ' + gAppInfo.version + personalText; // Cc['@mozilla.org/xre/app-info;1'].getService(Ci.nsIXULAppInfo).QueryInterface(Ci.nsIXULRuntime); var text = 'FF ' + AppConstants.MOZ_APP_VERSION_DISPLAY + personalText; AgentLabel.setAttribute( 'value', text ); position.parentNode.insertBefore(AgentLabel, position.nextSibling); } if( count == 1 ) { ClockLabel.addEventListener('click', function() { sec = 0; }); } window.setInterval( doDatClock , 1000 ); //-------------Modal-Dialog--------------------------------------- ClockLabel.addEventListener('mouseover', function() { const lang = 'de-DE'; const t = new Date(); const d10 = t.toLocaleDateString(lang,{timeZone:'Europe/Berlin',weekday:'long'}) const d15 = t.toLocaleDateString(lang,{timeZone:'Europe/Lisbon',weekday:'long'}) const d20 = t.toLocaleDateString(lang,{timeZone:'America/New_York',weekday:'long'}) const d30 = t.toLocaleDateString(lang,{timeZone:'Europe/Moscow',weekday:'long'}) const d40 = t.toLocaleDateString(lang,{timeZone:'Asia/Hong_Kong',weekday:'long'}) const d50 = t.toLocaleDateString(lang,{timeZone:'Australia/Sydney',weekday:'long'}) const h10 = t.toLocaleTimeString(lang,{timeZone:'Europe/Berlin',hour:'numeric',minute:'numeric',hour12:false}) const h15 = t.toLocaleTimeString(lang,{timeZone:'Europe/Lisbon',hour:'numeric',minute:'numeric',hour12:false}) const h20 = t.toLocaleTimeString(lang,{timeZone:'America/New_York',hour:'numeric',minute:'numeric',hour12:false}) const h30 = t.toLocaleTimeString(lang,{timeZone:'Europe/Moscow',hour:'numeric',minute:'numeric',hour12:false}) const h40 = t.toLocaleTimeString(lang,{timeZone:'Asia/Hong_Kong',hour:'numeric',minute:'numeric',hour12:false}) const h50 = t.toLocaleTimeString(lang,{timeZone:'Australia/Sydney',hour:'numeric',minute:'numeric',hour12:false}) const m10 = t.toLocaleDateString(lang,{timeZone:'Europe/Berlin',day: '2-digit', month: 'long'}) const m15 = t.toLocaleDateString(lang,{timeZone:'Europe/Lisbon',day: '2-digit', month: 'long'}) const m20 = t.toLocaleDateString(lang,{timeZone:'America/New_York',day: '2-digit', month: 'long'}) const m30 = t.toLocaleDateString(lang,{timeZone:'Europe/Moscow',day: '2-digit', month: 'long'}) const m40 = t.toLocaleDateString(lang,{timeZone:'Asia/Hong_Kong',day: '2-digit', month: 'long'}) const m50 = t.toLocaleDateString(lang,{timeZone:'Australia/Sydney',day: '2-digit', month: 'long'}) const y10 = t.toLocaleDateString(lang,{timeZone:'Europe/Berlin',year: 'numeric'}) const y15 = t.toLocaleDateString(lang,{timeZone:'Europe/Lisbon',year: 'numeric'}) const y20 = t.toLocaleDateString(lang,{timeZone:'America/New_York',year: 'numeric'}) const y30 = t.toLocaleDateString(lang,{timeZone:'Europe/Moscow',year: 'numeric'}) const y40 = t.toLocaleDateString(lang,{timeZone:'Asia/Hong_Kong',year: 'numeric'}) const y50 = t.toLocaleDateString(lang,{timeZone:'Australia/Sydney',year: 'numeric'}) const body = document.querySelector('body'); const dialog = document.createElement('dialog'); dialog.setAttribute('id', 'time-dialog'); dialog.innerHTML = ` <table> <tr><strong>Internationale Uhrzeiten</strong></tr> </table> <table> <tr> <td>Berlin:</td> <td>${h10}</td> <td>Uhr - </td> <td>${d10},</td> <td>${m10}</td> <td>${y10}</td> </tr> <tr> <td>Lagos(Pt):</td> <td>${h15}</td> <td>Uhr - </td> <td>${d15},</td> <td>${m15}</td> <td>${y15}</td> </tr> <tr> <td>New York:</td> <td>${h20}</td> <td>Uhr - </td> <td>${d20},</td> <td>${m20}</td> <td>${y20}</td> </tr> <tr> <td>Moskau:</td> <td>${h30}</td> <td>Uhr - </td> <td>${d30},</td> <td>${m30}</td> <td>${y30}</td> </tr> <tr> <td>Hongkong:</td> <td>${h40}</td> <td>Uhr - </td> <td>${d40},</td> <td>${m40}</td> <td>${y40}</td> </tr> <tr> <td>Sydney:</td> <td>${h50}</td> <td>Uhr - </td> <td>${d50},</td> <td>${m50}</td> <td>${y50}</td> </tr> </table> `; setTimeout(function() { dialog.close(); },1000); body.appendChild(dialog); dialog.showModal(); let sss = Components.classes['@mozilla.org/content/style-sheet-service;1'].getService(Components.interfaces.nsIStyleSheetService); let uri = Services.io.newURI('data:text/css;charset=utf-8,' + encodeURIComponent(` #time-dialog { max-width: auto; max-height: auto; border: 1px solid orange; border-radius: 4px; } `), null, null); sss.loadAndRegisterSheet(uri, sss.AUTHOR_SHEET); }) //-------------Modal-Dialog--------------------------------------- })();Da ist sicherlich noch viel redundant, gerade im Bereich der Variablen.
Danke für das fertige JavaScript.
Genau so sollte die Funktion werden.
Werde mir das mal ganz genau anschauen.
Damit ist dieser Thread am Ende.
Eventuell spiele ich noch etwas mit Sörens Codschnipsel herum, mal seh'n.
