Ich nutze für mich (LINUX, keine Garantie für andere BS) allerdings dies (mit den gleichen Icons wie oben):
Spoiler anzeigen
JavaScript
// B_Tooltip_toggle.uc.js
// dark theme
/*1. Verhalten des Tooltips beim start (ausgeschaltet/opacity:0)->*/
(function ttstart() {
// start config area--------------------------------------------
let IconPath = PathUtils.toFileURI(PathUtils.join(PathUtils.profileDir, 'chrome', 'icons')); // Pfad zum Ordner der das .svg-Symbol (mit: fill="context-fill" fill-opacity="context-fill-opacity") beinhaltet.
// end config area----------------------------------------------
g1_tooltip_b = "0";
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(`
tooltip[label*=" "],
tooltip,
#tabbrowser-tab-tooltip {
appearance: none !important;
background-color: #3f3f3f !important;
color: #F9F9F9 !important;
font-size: 13px !important;
line-height: unset !important;
border: 1px solid #b03b0099 !important;
border-radius: 4px !important;
box-shadow: none !important;
width: auto !important;
height: auto !important;
justify-content: center !important;
align-items: center !important;
align-content: center !important;
vertical-align: middle !important;
overflow: hidden !important;
padding: 3px 7px 5px 7px !important;
display: none !important;
}
.places-tooltip-title {
border-bottom: 1px solid #b03b0099 !important;
padding-bottom: 3px !important;
margin-left: -7px !important;
margin-right: -7px !important;
padding-left: 7px !important;
padding-right: 7px !important;
color: #F9F9F9 !important;
}
.places-tooltip-uri {
font-size: 13px !important;
padding-top: 4px !important;
padding-bottom: 0px !important;
color: #b0b0b0 !important;
}
.places-tooltip {
display: flex !important;
}
#remoteBrowserTooltip{
display: none !important;
}
/*■■■■■■■■■■■■■■■■■■■■■■■■■Tabvorschau■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
/*muss in user.js aktiviert werden*/
.tab-preview-container {
border: 1px solid #b03b0099 !important;
border-radius: 4px !important;
background-color: #3f3f3f !important;
margin: 0 !important;
margin-top: 10px !important;
padding: 0 !important;
line-height: unset !important;
display: none !important;
}
.tab-preview-text-container {
border-radius: 0 !important;
border: 0 !important;
background: none !important;
margin: 0 !important;
padding: 0 !important;
}
.tab-preview-title,
.tab-preview-uri {
font-size: 13px !important;
font-weight: normal !important;
margin: 0 !important;
}
.tab-preview-title {
color: #F9F9F9 !important;
border-bottom: 0px solid #b03b0099 !important;
padding: 3px 7px 3px 7px !important;
max-height: 200px !important;
word-break: break-word !important;
}
.tab-preview-uri {
color: #b0b0b0 !important;
border-top: 1px solid #b03b0099 !important;
padding: 3px 7px 4px 7px !important;
max-height: 200px !important;
}
.tab-preview-thumbnail-container img,
.tab-preview-thumbnail-container canvas {
border-top: 1px solid #b03b0099 !important;
}
.tab-preview-thumbnail-container {
border-top: 0px solid #b03b0099 !important;
&:empty {
display: none !important;
}
}
/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
#toggle-tt-button .toolbarbutton-icon {
list-style-image: url("${IconPath}/16_tooltip-empty_contprop.svg") !important;
fill: #f60 !important;
transition: fill 0.4s ease-in-out 0.0s !important;
padding-top: 6.5px !important;
padding-bottom: 5.5px !important;
}
#toggle-tt-button:hover .toolbarbutton-icon {
list-style-image: url("${IconPath}/16_tooltip-empty_contprop.svg") !important;
fill: #dddddd !important;
transition: fill 0.4s ease-in-out 0.0s !important;
padding-top: 6.5px !important;
padding-bottom: 5.5px !important;
}
#toggle-tt-button:active .toolbarbutton-icon {
list-style-image: url("${IconPath}/16_tooltip-text_contprop.svg") !important;
fill: gold !important;
transition: fill 0.0s ease-in-out 0.0s !important;
padding-top: 6.5px !important;
padding-bottom: 5.5px !important;
}
`), null, null);
sss.loadAndRegisterSheet(uri, sss.AGENT_SHEET);
})();
/*2. Einschalten des Tooltips per Button (opacity:1)->*/
function tton() {
// start config area--------------------------------------------
let IconPath = PathUtils.toFileURI(PathUtils.join(PathUtils.profileDir, 'chrome', 'icons')); // Pfad zum Ordner der das .svg-Symbol (mit: fill="context-fill" fill-opacity="context-fill-opacity") beinhaltet.
// end config area----------------------------------------------
g1_tooltip_b = "1";
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(`
tooltip[label*=" "],
tooltip,
#tabbrowser-tab-tooltip {
display: flex !important;
}
.places-tooltip {
display: flex !important;
}
#remoteBrowserTooltip{
display: none !important;
}
/*■■■■■■■■■■■■■■■■■■■■■■■■■Tabvorschau■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
.tab-preview-container {
display: block !important;
}
/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
#toggle-tt-button .toolbarbutton-icon {
list-style-image: url("${IconPath}/16_tooltip-text_contprop.svg") !important;
fill: gold !important;
transition: fill 0.4s ease-in-out 0.0s !important;
}
#toggle-tt-button:hover .toolbarbutton-icon {
list-style-image: url("${IconPath}/16_tooltip-text_contprop.svg") !important;
fill: #dddddd !important;
transition: fill 0.4s ease-in-out 0.0s !important;
}
#toggle-tt-button:active .toolbarbutton-icon {
list-style-image: url("${IconPath}/16_tooltip-empty_contprop.svg") !important;
fill: #f60 !important;
transition: fill 0.0s ease-in-out 0.0s !important;
}
`), null, null);
sss.loadAndRegisterSheet(uri, sss.AGENT_SHEET);
}
/*2a. Einschalten aller Tooltips per Button (opacity:1)->*/
function ttallon() {
// start config area--------------------------------------------
let IconPath = PathUtils.toFileURI(PathUtils.join(PathUtils.profileDir, 'chrome', 'icons')); // Pfad zum Ordner der das .svg-Symbol (mit: fill="context-fill" fill-opacity="context-fill-opacity") beinhaltet.
// end config area----------------------------------------------
g1_tooltip_b = "2";
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(`
tooltip[label*=" "],
tooltip,
#tabbrowser-tab-tooltip {
display: flex !important;
}
.places-tooltip {
display: flex !important;
}
#remoteBrowserTooltip{
display: flex !important;
padding: 4px 7px 4px 7px !important;
}
/*■■■■■■■■■■■■■■■■■■■■■■■■■Tabvorschau■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
.tab-preview-container {
display: block !important;
}
/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
#toggle-tt-button .toolbarbutton-icon {
list-style-image: url("${IconPath}/16_tooltip-text_contprop.svg") !important;
fill: #72a572 !important;
transition: fill 0.4s ease-in-out 0.0s !important;
}
#toggle-tt-button:hover .toolbarbutton-icon {
list-style-image: url("${IconPath}/16_tooltip-text_contprop.svg") !important;
fill: #dddddd !important;
transition: fill 0.4s ease-in-out 0.0s !important;
}
#toggle-tt-button:active .toolbarbutton-icon {
list-style-image: url("${IconPath}/16_tooltip-empty_contprop.svg") !important;
fill: #cd0e14 !important;
transition: fill 0.0s ease-in-out 0.0s !important;
}
`), null, null);
sss.loadAndRegisterSheet(uri, sss.AGENT_SHEET);
}
/*3. Ausschalten des Tooltips per Button (opacity:0)->*/
function ttoff() {
// start config area--------------------------------------------
let IconPath = PathUtils.toFileURI(PathUtils.join(PathUtils.profileDir, 'chrome', 'icons')); // Pfad zum Ordner der das .svg-Symbol (mit: fill="context-fill" fill-opacity="context-fill-opacity") beinhaltet.
// end config area----------------------------------------------
g1_tooltip_b = "0";
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(`
tooltip[label*=" "],
tooltip,
#tabbrowser-tab-tooltip {
display: none !important;
}
.places-tooltip {
display: flex !important;
}
#remoteBrowserTooltip{
display: none !important;
}
/*■■■■■■■■■■■■■■■■■■■■■■■■■Tabvorschau■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
.tab-preview-container {
display: none !important;
}
/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
#toggle-tt-button .toolbarbutton-icon {
list-style-image: url("${IconPath}/16_tooltip-empty_contprop.svg") !important;
fill: #f60 !important;
transition: fill 0.4s ease-in-out 0.0s !important;
}
#toggle-tt-button:hover .toolbarbutton-icon {
list-style-image: url("${IconPath}/16_tooltip-empty_contprop.svg") !important;
fill: #dddddd !important;
transition: fill 0.4s ease-in-out 0.0s !important;
}
#toggle-tt-button:active .toolbarbutton-icon {
list-style-image: url("${IconPath}/16_tooltip-text_contprop.svg") !important;
fill: gold !important;
transition: fill 0.0s ease-in-out 0.0s !important;
}
`), null, null);
sss.loadAndRegisterSheet(uri, sss.AGENT_SHEET);
}
/*3a. Ausschalten aller Tooltips per Button (opacity:0)->*/
function ttalloff() {
// start config area--------------------------------------------
let IconPath = PathUtils.toFileURI(PathUtils.join(PathUtils.profileDir, 'chrome', 'icons')); // Pfad zum Ordner der das .svg-Symbol (mit: fill="context-fill" fill-opacity="context-fill-opacity") beinhaltet.
// end config area----------------------------------------------
g1_tooltip_b = "3";
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(`
tooltip[label*=" "],
tooltip,
#tabbrowser-tab-tooltip {
display: none !important;
}
.places-tooltip {
display: none !important;
}
#remoteBrowserTooltip{
display: none !important;
}
/*■■■■■■■■■■■■■■■■■■■■■■■■■Tabvorschau■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
.tab-preview-container {
display: none !important;
}
/*■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■*/
#toggle-tt-button .toolbarbutton-icon {
list-style-image: url("${IconPath}/16_tooltip-empty_contprop.svg") !important;
fill: #cd0e14 !important;
transition: fill 0.4s ease-in-out 0.0s !important;
}
#toggle-tt-button:hover .toolbarbutton-icon {
list-style-image: url("${IconPath}/16_tooltip-empty_contprop.svg") !important;
fill: #dddddd !important;
transition: fill 0.4s ease-in-out 0.0s !important;
}
#toggle-tt-button:active .toolbarbutton-icon {
list-style-image: url("${IconPath}/16_tooltip-text_contprop.svg") !important;
fill: #72a572 !important;
transition: fill 0.0s ease-in-out 0.0s !important;
}
`), null, null);
sss.loadAndRegisterSheet(uri, sss.AGENT_SHEET);
}
/*4. Button Tooltip on/off (opacity: 1/0)->*/
(function() {
/*Icon + Iconpfad wird durch 1.-3. geregelt (sollte der Pfad oder die Icons dort entfernt werden, muss das hier wieder aktiviert werden); Nachteil: nur ein Icon, keine transition; kein fill*/
/*
// start config area
let ButtonIcon = "16_tooltip-text_contprop.svg" // Name & Dateiendung des anzuzeigenden Symbols.
let ButtonIconPath = "/chrome/css/image/" // Pfad zum Ordner der das Symbol beinhaltet.
// end config area
*/
if (location.href !== 'chrome://browser/content/browser.xhtml') return;
try {
CustomizableUI.createWidget({
id: 'toggle-tt-button',
type: 'custom',
defaultArea: CustomizableUI.AREA_NAVBAR,
onBuild: function(aDocument) {
let toolbaritem = aDocument.createElementNS('http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul', 'toolbarbutton');
var props = {
id: 'toggle-tt-button',
class: 'toolbarbutton-1 chromeclass-toolbar-additional',
removable: 'true',
label: 'Toggle Tooltip',
accesskey: '',
tooltiptext: 'Tooltip on/off\n\nStart: Nur Tt-Bookmarks sichtbar\n\nToggle Linksklick\nLinksklick \'on\': Alle bis auf Tt-Content sichtbar\nLinksklick \'off\': zurück auf \'Start\'\n\nToggle Mittelklick\nMittelklick \'on\': ALLE Tt\'s sichtbar \nMittelklick \'off\': ALLE Tt\'s ausgeblendet'
/* style: "list-style-image: url('" + PathUtils.toFileURI(PathUtils.join(PathUtils.profileDir)) + ButtonIconPath + ButtonIcon + "');",*/
/*Icon+Pfad wird durch 1.-3. geregelt (sollte der Pfad oder die Icons dort entfernt werden, muss das hier wieder aktiviert werden)*/
};
for(var p in props)
toolbaritem.setAttribute(p, props[p]);
return toolbaritem;
}
});
} catch(e) { };
document.getElementById('toggle-tt-button').addEventListener( "click", onClick );
function onClick(aEvent) {
if (event.button == 0) {
if(g1_tooltip_b == '') {
g1_tooltip_b = '1';
tton();
}
else if(g1_tooltip_b == '0') {
g1_tooltip_b = '1';
tton();
}
else if(g1_tooltip_b == '1') {
g1_tooltip_b = '0';
ttoff();
}/**/
else if(g1_tooltip_b == '3') {
g1_tooltip_b = '0';
ttoff();
}
else if(g1_tooltip_b == '2') {
g1_tooltip_b = '1';
ttoon();
}
}
else
if (event.button == 1) {
if(g1_tooltip_b == '') {
g1_tooltip_b = '2';
tton();
}
else if(g1_tooltip_b == '2') {
g1_tooltip_b = '3';
ttalloff();
}
else if(g1_tooltip_b == '3') {
g1_tooltip_b = '2';
ttallon();
}/**/
else if(g1_tooltip_b == '1') {
g1_tooltip_b = '2';
ttallon();
}
else if(g1_tooltip_b == '0') {
g1_tooltip_b = '3';
ttalloff();
}
}
else
if (event.button == 2) {
event.button.stopPropagation();
//alert("Rechtsklick wird nicht unterstützt");
}
else {
alert("ERROR: B_Tooltip_toggle.uc.js");
};
}
})();
Alles anzeigen
Ja ich weiß, ist wie mit Kanonen auf Spatzen schießen, deshalb am Besten gleich wieder vergessen!