Beiträge von Mitleser

Mitleser

Zitat von Horstmann

von mir mit separatem Button für den Positionswechsel der Leiste

Das wirst du sicherlich in der finalen Version noch ändern (Dropdown oder freie Maustasten). Ich werde das Thema auf 'erledigt' setzen, denn das Script aus Beitrag #1 funktioniert ja. Um den 🫎️ werde ich mich später kümmern, denn das ist eine globale Problematik bei diesem Typ des Buttons. Muss jetzt ersteinmal in die reale Welt zurück, meinen gerade gelieferten Kick-E-Scooter 🛴 testen.
EDIT: Ich habe das Script in Beitrag #1 angepasst (vereinfacht/kleinere Fehler [Iconanzeige im zweiten Fenster] behoben).

Mitleser

Zitat von Horstmann

Beide benutzen Services.wm.getEnumerator um die Button Funktion auf alle Fenster zu erweitern bzw. in meinem Fall optional auch einzuschränken.

Diese Lsg. hatte ich schon gesehen, aber - als zu kompliziert - ersteinmal verworfen. Eine einfachere Lsg. habe ich bisher nicht gefunden/gibt es wohl auch nicht. Ich werde diese Woche die von Aris abschreiben/ableiten und einfügen und dann an dieser Stelle posten..

Mitleser

Zitat von Horstmann

funktioniert hier generell in mehreren offenen Fenstern, aber nicht immer konsistent

Kann ich hier auf Linux nicht bestätigen. Leider schaltet links/rechts in sämtlichen offenen Fenstern gleichzeitig (Vorschläge erwünscht). On/off schaltet im jeweils aktivem Fenster (durch event.target.ownerGlobal). In der Zeile 138 müsste es etwas vergleichbares geben. event.target.ownerGlobal.horizontal(); funktioniert jedenfalls nicht.

Vielleicht irgendetwas mit Windows.window...

Mitleser

@Horstmann , danke fürs Testen!

Zitat von Horstmann

Ich hatte inzwischen mal kurz in meiner Toolbarversion diese Arislösung für nicht funktionierende Buttons angetestet in Fx 144, schien hier zu klappen.

Die Lsg. von Aris hatte ich auch in Betracht gezogen, die macht den Quellcode aber noch anfälliger für Veränderungen durch Updates. Deshalb bin ich bei der Patchlsg. geblieben.

Zitat von Horstmann

Dein Button funktioniert hier nicht mit dem Elchtest

Mit der Elchtestproblematik kann ich leben, diese Konstellation ist wohl eher selten. Die On/Off-funktion funktioniert ja in einem zweiten geöffneten Fenster unabhängig vom Ersten. Die Links/Rechts-funktion leider nicht (Vorschläge??).

Zitat von Horstmann

Zeile 133 bis 151, für bar in Zeile 148 hatte ich halt meine eigene toolbar ID eingesetzt

Verstehe ich nicht???

Mitleser

Update von 00_FlyVertToolbarWithButton_lite.uc.js vom 2025-10-25 gibt es jetzt (und für zukünftige Versionen nur noch) in Beitrag #1 in diesem Thema:
Schaltbare vertikale Overlay-Zusatzleiste !

Mitleser

Die Overlay-Zusatzleiste liegt über dem Seiteninhalt (und verdeckt diesen partiell), verschiebt den Content der Seite jedoch nicht.

EDIT: 2026-06-15: Neue Version (Angepasst für FF 152).

Updatehistorie

EDIT: 2025-06-06: Neue Version (mit zusätzlichem Feature: Mittelklick verschiebt die Tb an den gegenüberliegenden Fensterrand; Rechtsklick wieder zurück).
EDIT: 2025-09-20: Neue Version (beim Verkleinern des Fensters bleibt die Buttongröße erhalten, außerdem wird das Kontextmenü beim Rechtsklick ausgeblendet).
EDIT: 2025-09-25: Neue Version (Der Startzustand der TB (on/off) ist in den 'UserConfigurations' einstellbar).
EDIT: 2025-10-25: Neue Version (Der On/Off-Status sowie die horizontale Position der TB werden beim Beenden des Browsers gespeichert und beim Start wiederhergestellt).
EDIT: 2025-11-07: Neue Version (Die Links/Rechts-funktion arbeitet jetzt [ebenso wie die On/Off-funktion] in einem zweiten geöffneten Fenster unabhängig vom Ersten).
EDIT: 2025-12-05: Neue Version (Die vertikale Position der Leiste kann jetzt gescrollt werden).
EDIT: 2025-12-17: Neue Version (Usability bei gesetztem border verbessert).
EDIT: 2026-05-04: Neue Version (Enthält Anpassungen für FF 152).
EDIT: 2026-06-15: Neue Version (Angepasst für FF 152).

JavaScript

// JavaScript Document
// 00_FlyVertToolbarWithButton_lite.uc.js
// FF 152 +
// Vers. 6.1

// Quelle: https://www.....

// Idee von Horstmann: https://www.camp-firefox.de/forum/thema/137714-seitennavigation-fly-out-men%C3%BC/?postID=1246875#post1246875

// Das Script erstellt eine - über dem Seiteninhalt liegende - vertikale Toolbar, die sich per Button ein/ausblenden lässt. Im eingeblendeten Zustand sind nur die Buttons sichtbar, beim Mouseover auf die Leiste werden die Labels aller B.'s 'ausgeklappt'. Die Verzögerungszeit vom Mouseover bis zum 'Ausklappzeitpunkt' der Labels kann konfiguriert werden [--vt-delay_min_max-width: 1.5s; /*Verzögerung bei mouseover*/]. Z.B so, dass die Labels der Buttons erst nach > 10.0s mouseover sichtbar sind - also eigentlich nie; oder nach < 0.5s - fast sofort.
// Die TB ist in der in der Höhe flexibel (je nach Anzahl der Buttons).
// Die vertikale Startposition (oben/unten) ist prozentual einstellbar. Zusätzlich kann die TB mit dem Mausrad (Mauszeiger auf Leiste) vertikal verschoben werden (temporär, wird beim Beenden des Browsers nicht gespeichert).
// Die horizontale Position der TB (links/rechts) ist per Rechtsklick wählbar.
// Der On/Off-Status sowie die horizontale Position der TB werden beim Beenden des Browsers gespeichert und beim Start wiederhergestellt.
// Beide Funktionen arbeiten in weiteren geöffneten Fenstern unabhängig vom Ersten.
// Das .svg-Icon des Buttons zum Ein/Ausblenden der Bar kann - je nach Hover-Zustand - mit zwei unterschiedlichen Farben gefüllt werden [fill/stroke].
// WICHTIG: Die TB ist im 'Anpassenfenster' nur im eingeschalteten Zustand sichtbar (vermeidet Verdeckung/Überlagerung anderer Symbole).

// ACHTUNG: Einige Systembuttons lassen sich in zusätzliche/eigene Tb's zwar noch verschieben, haben aber KEINE Funktion. Dazu gibt es einen Patch von @BrokenHeart:  https://www.camp-firefox.de/forum/thema/138875-fix-toolbar-buttons-reagieren-nicht-mehr-ab-ff-134/

(function() {
  if (!window.gBrowser)
	return;
const
// ■■ START UserConfiguration ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
         id = 'vert_toolbar_button', // Id des Buttons
      label = 'Vertikale Overlay Toolbar', // Bezeichnung des Buttons
tooltiptext = 'Vertikale Overlay Toolbar\n\nLinksklick: ein/aus\nRechtsklick: links/rechts\nMausrad(Mauszeiger auf Leiste): oben/unten',
// Icon-------------------------------------------------------
       icon = '16_ci-bar-right_moz.svg', // [Name.Dateiendung] des Symbols
   iconPath = '/chrome/icons/', // Pfad zum Ordner der das Icon enthält
  iconColOu = 'currentColor', // Farbe des Icons (nur .svg-Datei mit [moz-context-properties], bei anderen Icons hat const iconColOu keine Funktion)
  iconColOv = '#9aff9a', // Farbe des Icons beim Überfahren des Buttons (nur .svg-Datei mit [moz-context-properties], bei anderen Icons hat const iconColOv keine Funktion)
// Toolbar----------------------------------------------------
	 isPosV = '50%', // Toolbar mittig zur Fensterhöhe;
//   isPosV = '0%',     Toolbar am oberen Fensterrand;
//   isPosV = '100%',   Toolbar am unteren Fensterrand;
wheelFactor = 0.2,   // Scrollfunktion (bei Mauszeiger auf Leiste), je höher der Wert desto größer die Schrittweite der Rasterung des Mausrades;
// ■■ END UserConfiguration ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
 curProfDir = PathUtils.toFileURI(PathUtils.join(PathUtils.profileDir));
//Pref '.svg.context-...' prüfen/setzen
if (Services.prefs.getBoolPref('svg.context-properties.content.enabled') == false) {
	Services.prefs.setBoolPref('svg.context-properties.content.enabled', true );
}
//userPrefs
Services.prefs.getDefaultBranch('userchrome.flyvert-toolbar.').setBoolPref('visible', true);
Services.prefs.getDefaultBranch('userchrome.flyvert-toolbar.').setBoolPref('horizontal', true); //true=left/false=right

const
boolPrefVis = 'userchrome.flyvert-toolbar.visible',
 getPrefVis = Services.prefs.getBoolPref(boolPrefVis),
    setPref = Services.prefs.setBoolPref,

boolPrefHor = 'userchrome.flyvert-toolbar.horizontal',
 getPrefHor = Services.prefs.getBoolPref(boolPrefHor);
//TOOLBAR
const toolbar = document.createXULElement('toolbar');
      toolbar.id = 'vert_toolbar';
	  toolbar.setAttribute('orient', 'vertical');
      toolbar.setAttribute('customizable', true);
	  toolbar.setAttribute('mode', 'icons');
	  toolbar.setAttribute('context', 'toolbar-context-menu');
	  toolbar.setAttribute('class','toolbar-primary chromeclass-toolbar browser-toolbar customization-target');
//TOOLBOX
const toolbox = document.createXULElement('toolbox');
	  toolbox.id = 'vert_toolbox';
      toolbox.setAttribute('orient','mirror');

	  toolbox.appendChild(toolbar);

document.getElementById('browser').parentNode.appendChild(toolbox);
//reg
CustomizableUI.registerArea('vert_toolbar', {legacy: true});
CustomizableUI.registerToolbarNode(toolbar);
//start on/off
switch (getPrefVis) {
	case true:
		vert_toolbar.classList.toggle('button-on');
	break;
	case false:
		vert_toolbar.classList.toggle('button-off');
	break;
};
//start left/right(A)
switch (getPrefHor) {
	case true:
		vert_toolbar.classList.toggle('bar-left');
		vert_toolbox.classList.toggle('bar-left');
	break;
	case false:
		vert_toolbar.classList.toggle('bar-right');
		vert_toolbox.classList.toggle('bar-right');
	break;
};
//BUTTON
try {
	CustomizableUI.createWidget({
		id: id,
		defaultArea: CustomizableUI.AREA_NAVBAR,
		label: label,
		tooltiptext: tooltiptext,

		onCreated: (button) => {
			button.style.MozContextProperties = 'fill, stroke, fill-opacity, stroke-opacity';
			button.style.listStyleImage = 'url("' + curProfDir + iconPath + icon + '")';
			button.style.stroke = iconColOu;
			button.style.minWidth = 'fit-content';
		}
	});
} catch(e) {};

const button = document.getElementById(id);
//start left/right(B)
switch (getPrefHor) {
	case true:
		button.classList.toggle('bar-left');
	break;
	case false:
		button.classList.toggle('bar-right');
	break;
};
//over
button.addEventListener('mouseover', () => {
		button.style.stroke = iconColOv;
});
//out
button.addEventListener('mouseout', () => {
		button.style.stroke = iconColOu;
});
//contextmenu
button.addEventListener('contextmenu', e => {
	if (event.button === 2) {
		e.preventDefault();
	}
});
//click
button.addEventListener('click', () => {
	if (event.button === 0) {
		vert_toolbar.classList.toggle('button-off');
		vert_toolbar.classList.toggle('button-on');

			const getPrefVis = Services.prefs.getBoolPref(boolPrefVis);
			switch (getPrefVis) {
				case true:
					setPref(boolPrefVis, false);
				break;
				case false:
					setPref(boolPrefVis, true);
				break;
			}
	}
	else
	if ((event.button === 2) && (vert_toolbar.classList.contains('button-on') === true )) {
		vert_toolbar.classList.toggle('bar-left');
		vert_toolbar.classList.toggle('bar-right');
		vert_toolbox.classList.toggle('bar-left');
		vert_toolbox.classList.toggle('bar-right');
		vert_toolbar_button.classList.toggle('bar-left');
		vert_toolbar_button.classList.toggle('bar-right');

			const getPrefHor = Services.prefs.getBoolPref(boolPrefHor);
			switch (getPrefHor) {
				case true:
					setPref(boolPrefHor, false);
				break;
				case false:
					setPref(boolPrefHor, true);
				break;
			}
		css();
	}
});
//wheel
toolbox.addEventListener('wheel', (event) => {
	event.preventDefault();

	let curPos = toolbox.offsetTop;
		curPos = parseInt(curPos)-(event.wheelDelta*wheelFactor);

	toolbox.style.top = curPos + 'px';
});

function css (){
let css =`
	#vert_toolbar {
/* ■■ START UserConfiguration TOOLBAR ■■■■■■■■■■■■■■■■■■■■■■■ Dark Theme */
		--vt-toolbar-min-width: 32px; /*Leistenbreite bei mouseout*/
		--vt-toolbar-max-width: 260px; /*Leistenbreite bei mouseover*/
		--vt-delay_min_max-width: 1.5s; /*Verzögerung bei mouseover*/
		--vt-row-height: 32px; /*Zeilenhöhe*/
		--vt-bg-color: #3d3d3d; /*Leistenhintergrundfarbe*/
		--vt-bg-color-hover: #57575766; /*Zeilenhintergrundfarbe bei mouseover*/
		--vt-border-width: 0px; /*Leistenrandbreite*/
		--vt-border-radius: 4px; /*Leistenrandeckenhalbdurchmesser*/
		--vt-border-color: purple; /*Leistenrandfarbe*/
		--vt-customizing-bg-color: #3d3d3d; /*Leistenhintergrundfarbe im Anpassenfenster*/
		--vt-customizing-border-color: #E9E9E9; /*Leistenrandfarbe im Anpassenfenster*/
		--vt-toolbarbutton-padding-inner: 8px; /*Zentrierungsmöglichkeit der eingefügten Buttons (wenn Buttonbreite < 32px => --vt-toolbarbutton-padding-inner < 8px) */
/* ■■ END UserConfiguration TOOLBAR ■■■■■■■■■■■■■■■■■■■■■■■■■ */
	}

	#vert_toolbox {
		position: fixed !important;
		display: flex !important;
		top: ${isPosV};
		transform: translateY(-${isPosV});
		height: fit-content !important;
		width: fit-content !important;
		z-index: 6516516511 !important;
	}

	#vert_toolbox.bar-left {
		left: 0 !important;
		right: unset !important;
	}
	#vert_toolbox.bar-right {
		right: 0 !important;
		left: unset !important;
	}

	#vert_toolbar {
		display: flex !important;
		min-width: 0px !important;
		width: calc(var(--vt-toolbar-min-width) + 2*var(--vt-border-width)) !important;
		padding: 0 !important;
		background-color: var(--vt-bg-color) !important;
		border: var(--vt-border-width) solid var(--vt-border-color) !important;
		transition: width .5s ease-in-out .2s !important;
	}

	#vert_toolbar.bar-right {
		border-top-right-radius: 0 !important;
		border-top-left-radius: var(--vt-border-radius) !important;
		border-bottom-right-radius: 0 !important;
		border-bottom-left-radius: var(--vt-border-radius) !important;
		margin-left: calc(var(--vt-toolbar-min-width) * -1) !important;
		margin-right: unset !important;
	}
	#vert_toolbar.bar-left {
		border-top-left-radius: 0 !important;
		border-top-right-radius: var(--vt-border-radius) !important;
		border-bottom-left-radius: 0 !important;
		border-bottom-right-radius: var(--vt-border-radius) !important;
		margin-right: calc(var(--vt-toolbar-min-width) * -1) !important;
		margin-left: unset !important;
	}

	#vert_toolbar:not([customizing]):hover {
		width: var(--vt-toolbar-max-width) !important;
		transition-delay: var(--vt-delay_min_max-width) !important;
	}

	#vert_toolbar.button-on {
		display: flex !important;
	}
	#vert_toolbar.button-off  {
		display: none !important;
	}

	#vert_toolbar:not([customizing]) .toolbarbutton-1  {
		justify-content: flex-start !important;
		min-width: var(--vt-toolbar-min-width) !important;
		height: var(--vt-row-height) !important;
		min-height: var(--vt-row-height) !important;
		max-height: var(--vt-row-height) !important;
		overflow: hidden !important;
		border: none !important;
		box-shadow: none !important;
		--toolbarbutton-padding-inner: var(--vt-toolbarbutton-padding-inner) !important;
	 	--toolbarbutton-padding-outer: 0 !important;
	 	--toolbarbutton-border-radius: 0 !important;
	}
	#vert_toolbar:not([customizing]) .toolbarbutton-1:hover {
		background-color: var(--vt-bg-color-hover) !important;
	}

	#vert_toolbar:not([customizing]).bar-left .toolbarbutton-1:first-of-type {
		border-top-right-radius: var(--vt-border-radius) !important;
		border-top-left-radius: 0 !important;
	}
	#vert_toolbar:not([customizing]).bar-right .toolbarbutton-1:first-of-type {
		border-top-right-radius: 0 !important;
		border-top-left-radius: var(--vt-border-radius)!important;
	}
	#vert_toolbar:not([customizing]).bar-left .toolbarbutton-1:last-of-type {
		border-bottom-left-radius: 0 !important;
		border-bottom-right-radius: var(--vt-border-radius) !important;
	}
	#vert_toolbar:not([customizing]).bar-right .toolbarbutton-1:last-of-type {
		border-bottom-right-radius: 0 !important;
		border-bottom-left-radius: var(--vt-border-radius) !important;
		}

	#vert_toolbar:not([customizing]) .toolbarbutton-1 .toolbarbutton-text {
		display: flex !important;
		opacity: 0 !important;
		transition: opacity .5s ease-in-out .2s !important;
		text-overflow: ellipsis !important;
		align-items: center !important;
		padding: 0 !important;
	 	border-radius: 0 !important;
	}
	#vert_toolbar:not([customizing]):hover .toolbarbutton-1 .toolbarbutton-text {
		opacity: 1 !important;
		transition: opacity .5s ease-in-out var(--vt-delay_min_max-width) !important;
	}
	#vert_toolbar[customizing] {
		min-height: 38px !important;
		min-width: 38px !important;
		max-width: 38px !important;
		margin-right: 0 !important;
		margin-left: 0 !important;
		padding-bottom: 38px !important;
		background: var(--vt-customizing-bg-color) !important;
		border: 1px dashed var(--vt-customizing-border-color) !important;
	}

	#vert_toolbar_button.bar-left .toolbarbutton-icon {
		transform: scaleX(-1) !important;
	}
	#vert_toolbar_button.bar-right .toolbarbutton-icon {
		transform: scaleX(1) !important;
	}
`;
const sss = Cc['@mozilla.org/content/style-sheet-service;1'].getService(Ci.nsIStyleSheetService);
const uri = makeURI('data:text/css;charset=UTF=8,' + encodeURIComponent(css));
sss.loadAndRegisterSheet(uri, sss.AUTHOR_SHEET);
};

css();

})();

Alles anzeigen

Script für FF 139 bis FF 151

JavaScript

// JavaScript Document
// 00_FlyVertToolbarWithButton_lite.uc.js
// FF 139 - FF 151
// Vers. 6.0

// Quelle: https://www.....

// Idee von Horstmann: https://www.camp-firefox.de/forum/thema/137714-seitennavigation-fly-out-men%C3%BC/?postID=1246875#post1246875

// Das Script erstellt eine - über dem Seiteninhalt liegende - vertikale Toolbar, die sich per Button ein/ausblenden lässt. Im eingeblendeten Zustand sind nur die Buttons sichtbar, beim Mouseover auf die Leiste werden die Labels aller B.'s 'ausgeklappt'. Die Verzögerungszeit vom Mouseover bis zum 'Ausklappzeitpunkt' der Labels kann konfiguriert werden [--vt-delay_min_max-width: 1.5s; /*Verzögerung bei mouseover*/]. Z.B so, dass die Labels der Buttons erst nach > 10.0s mouseover sichtbar sind - also eigentlich nie; oder nach < 0.5s - fast sofort.
// Die TB ist in der in der Höhe flexibel (je nach Anzahl der Buttons).
// Die vertikale Startposition (oben/unten) ist prozentual einstellbar. Zusätzlich kann die TB mit dem Mausrad (Mauszeiger auf Leiste) vertikal verschoben werden (temporär, wird beim Beenden des Browsers nicht gespeichert).
// Die horizontale Position der TB (links/rechts) ist per Rechtsklick wählbar.
// Der On/Off-Status sowie die horizontale Position der TB werden beim Beenden des Browsers gespeichert und beim Start wiederhergestellt.
// Beide Funktionen arbeiten in weiteren geöffneten Fenstern unabhängig vom Ersten.
// Das .svg-Icon des Buttons zum Ein/Ausblenden der Bar kann - je nach Hover-Zustand - mit zwei unterschiedlichen Farben gefüllt werden [fill/stroke].
// WICHTIG: Die TB ist im 'Anpassenfenster' nur im eingeschalteten Zustand sichtbar (vermeidet Verdeckung/Überlagerung anderer Symbole).

// ACHTUNG: Einige Systembuttons lassen sich in zusätzliche/eigene Tb's zwar noch verschieben, haben aber KEINE Funktion. Dazu gibt es einen Patch von @BrokenHeart:  https://www.camp-firefox.de/forum/thema/138875-fix-toolbar-buttons-reagieren-nicht-mehr-ab-ff-134/

(function() {
  if (!window.gBrowser)
	return;
const
// ■■ START UserConfiguration ■■■■■■■■■■■■■■■■■■■■■■■■■
         id = 'vert_toolbar_button', // Id des Buttons
      label = 'Vertikale Overlay Toolbar', // Bezeichnung des Buttons
tooltiptext = 'Vertikale Overlay Toolbar\n\nLinksklick: ein/aus\nRechtsklick: links/rechts\nMausrad(Mauszeiger auf Leiste): oben/unten',
// Icon------------------------------------------------
       icon = '16_ci-bar-right_moz.svg', // [Name.Dateiendung] des Symbols
   iconPath = '/chrome/icons/', // Pfad zum Ordner der das Icon enthält
  iconColOu = 'currentColor', // Farbe des Icons (nur .svg-Datei mit [moz-context-properties], bei anderen Icons hat const iconColOu keine Funktion)
  iconColOv = '#9aff9a', // Farbe des Icons beim Überfahren des Buttons (nur .svg-Datei mit [moz-context-properties], bei anderen Icons hat const iconColOv keine Funktion)
// Toolbar---------------------------------------------
	 isPosV = '50%', // Toolbar mittig zur Fensterhöhe;
//   isPosV = '0%',     Toolbar am oberen Fensterrand;
//   isPosV = '100%',   Toolbar am unteren Fensterrand;
wheelFactor = 0.2,   // Scrollfunktion (bei Mauszeiger auf Leiste), je höher der Wert desto größer die Schrittweite der Rasterung des Mausrades;
// ■■ END UserConfiguration ■■■■■■■■■■■■■■■■■■■■■■■■■■■
 curProfDir = PathUtils.toFileURI(PathUtils.join(PathUtils.profileDir));
//Pref '.svg.context-...' prüfen/setzen
if (Services.prefs.getBoolPref('svg.context-properties.content.enabled') == false) {
	Services.prefs.setBoolPref('svg.context-properties.content.enabled', true );
}
//userPrefs
Services.prefs.getDefaultBranch('userchrome.flyvert-toolbar.').setBoolPref('visible', true);
Services.prefs.getDefaultBranch('userchrome.flyvert-toolbar.').setBoolPref('horizontal', true); //true=left/false=right

const
boolPrefVis = 'userchrome.flyvert-toolbar.visible',
 getPrefVis = Services.prefs.getBoolPref(boolPrefVis),
    setPref = Services.prefs.setBoolPref,

boolPrefHor = 'userchrome.flyvert-toolbar.horizontal',
 getPrefHor = Services.prefs.getBoolPref(boolPrefHor);
//TOOLBAR
const toolbar = document.createXULElement('toolbar');
      toolbar.id = 'vert_toolbar';
	  toolbar.setAttribute('orient', 'vertical');
      toolbar.setAttribute('customizable', true);
	  toolbar.setAttribute('mode', 'icons');
	  toolbar.setAttribute('context', 'toolbar-context-menu');
	  toolbar.setAttribute('class','toolbar-primary chromeclass-toolbar browser-toolbar customization-target');
//TOOLBOX
const toolbox = document.createXULElement('toolbox');
	  toolbox.id = 'vert_toolbox';
      toolbox.setAttribute('orient','mirror');

	  toolbox.appendChild(toolbar);

document.getElementById('browser').parentNode.appendChild(toolbox);
//reg
CustomizableUI.registerArea('vert_toolbar', {legacy: true});
CustomizableUI.registerToolbarNode(toolbar);
//start on/off
switch (getPrefVis) {
	case true:
		vert_toolbar.classList.toggle('button-on');
	break;
	case false:
		vert_toolbar.classList.toggle('button-off');
	break;
};
//start left/right(A)
switch (getPrefHor) {
	case true:
		vert_toolbar.classList.toggle('bar-left');
		vert_toolbox.classList.toggle('bar-left');
	break;
	case false:
		vert_toolbar.classList.toggle('bar-right');
		vert_toolbox.classList.toggle('bar-right');
	break;
};
//BUTTON
try {
	CustomizableUI.createWidget({
		id: id,
		defaultArea: CustomizableUI.AREA_NAVBAR,
		label: label,
		tooltiptext: tooltiptext,

		onCreated: (button) => {
			button.style.MozContextProperties = 'fill, stroke, fill-opacity, stroke-opacity';
			button.style.listStyleImage = 'url("' + curProfDir + iconPath + icon + '")';
			button.style.stroke = iconColOu;
			button.style.minWidth = 'fit-content';
		}
	});
} catch(e) {};

const button = document.getElementById(id);
//start left/right(B)
switch (getPrefHor) {
	case true:
		button.classList.toggle('bar-left');
	break;
	case false:
		button.classList.toggle('bar-right');
	break;
};
//over
button.addEventListener('mouseover', () => {
		button.style.stroke = iconColOv;
});
//out
button.addEventListener('mouseout', () => {
		button.style.stroke = iconColOu;
});
//contextmenu
button.addEventListener('contextmenu', e => {
	if (event.button === 2) {
		e.preventDefault();
	}
});
//click
button.addEventListener('click', () => {
	if (event.button === 0) {
		vert_toolbar.classList.toggle('button-off');
		vert_toolbar.classList.toggle('button-on');

			const getPrefVis = Services.prefs.getBoolPref(boolPrefVis);
			switch (getPrefVis) {
				case true:
					setPref(boolPrefVis, false);
				break;
				case false:
					setPref(boolPrefVis, true);
				break;
			}
	}
	else
	if ((event.button === 2) && (vert_toolbar.classList.contains('button-on') === true )) {
		vert_toolbar.classList.toggle('bar-left');
		vert_toolbar.classList.toggle('bar-right');
		vert_toolbox.classList.toggle('bar-left');
		vert_toolbox.classList.toggle('bar-right');
		vert_toolbar_button.classList.toggle('bar-left');
		vert_toolbar_button.classList.toggle('bar-right');

			const getPrefHor = Services.prefs.getBoolPref(boolPrefHor);
			switch (getPrefHor) {
				case true:
					setPref(boolPrefHor, false);
				break;
				case false:
					setPref(boolPrefHor, true);
				break;
			}
		css();
	}
});
//wheel
toolbox.addEventListener('wheel', (event) => {
	event.preventDefault();

	let curPos = toolbox.offsetTop;
		curPos = parseInt(curPos)-(event.wheelDelta*wheelFactor);

	toolbox.style.top = curPos + 'px';
});

function css (){
let css =`
	#vert_toolbar {
/* ■■ START UserConfiguration TOOLBAR ■■■■■■■■■■■■■■■■ Dark Theme */
		--vt-toolbar-min-width: 32px; /*Leistenbreite bei mouseout*/
		--vt-toolbar-max-width: 260px; /*Leistenbreite bei mouseover*/
		--vt-delay_min_max-width: 1.5s; /*Verzögerung bei mouseover*/
		--vt-row-height: 32px; /*Zeilenhöhe*/
		--vt-bg-color: #3d3d3d; /*Leistenhintergrundfarbe*/
		--vt-bg-color-hover: #57575766; /*Zeilenhintergrundfarbe bei mouseover*/
		--vt-border-width: 0px; /*Leistenrandbreite*/
		--vt-border-radius: 4px; /*Leistenrandeckenhalbdurchmesser*/
		--vt-border-color: purple; /*Leistenrandfarbe*/
		--vt-customizing-bg-color: #3d3d3d; /*Leistenhintergrundfarbe im Anpassenfenster*/
		--vt-customizing-border-color: #E9E9E9; /*Leistenrandfarbe im Anpassenfenster*/
		--vt-toolbarbutton-inner-padding: 8px; /*Zentrierungsmöglichkeit der eingefügten Buttons (wenn Buttonbreite < 32px => --vt-toolbarbutton-inner-padding < 8px) */
/* ■■ END UserConfiguration TOOLBAR ■■■■■■■■■■■■■■■■■■ */
	}

	#vert_toolbox {
		position: fixed !important;
		display: flex !important;
		top: ${isPosV};
		transform: translateY(-${isPosV});
		height: fit-content !important;
		width: fit-content !important;
		z-index: 6516516511 !important;
	}

	#vert_toolbox.bar-left {
		left: 0 !important;
		right: unset !important;
	}
	#vert_toolbox.bar-right {
		right: 0 !important;
		left: unset !important;
	}

	#vert_toolbar {
		display: flex !important;
		min-width: 0px !important;
		width: calc(var(--vt-toolbar-min-width) + 2*var(--vt-border-width)) !important;
		padding: 0 !important;
		background-color: var(--vt-bg-color) !important;
		border: var(--vt-border-width) solid var(--vt-border-color) !important;
		transition: width .5s ease-in-out .2s !important;
	}

	#vert_toolbar.bar-right {
		border-top-right-radius: 0 !important;
		border-top-left-radius: var(--vt-border-radius) !important;
		border-bottom-right-radius: 0 !important;
		border-bottom-left-radius: var(--vt-border-radius) !important;
		margin-left: calc(var(--vt-toolbar-min-width) * -1) !important;
		margin-right: unset !important;
	}
	#vert_toolbar.bar-left {
		border-top-left-radius: 0 !important;
		border-top-right-radius: var(--vt-border-radius) !important;
		border-bottom-left-radius: 0 !important;
		border-bottom-right-radius: var(--vt-border-radius) !important;
		margin-right: calc(var(--vt-toolbar-min-width) * -1) !important;
		margin-left: unset !important;
	}

	#vert_toolbar:not([customizing]):hover {
		width: var(--vt-toolbar-max-width) !important;
		transition-delay: var(--vt-delay_min_max-width) !important;
	}

	#vert_toolbar.button-on {
		display: flex !important;
	}
	#vert_toolbar.button-off  {
		display: none !important;
	}

	#vert_toolbar:not([customizing]) .toolbarbutton-1  {
		justify-content: flex-start !important;
		min-width: var(--vt-toolbar-min-width) !important;
		height: var(--vt-row-height) !important;
		min-height: var(--vt-row-height) !important;
		max-height: var(--vt-row-height) !important;
		overflow: hidden !important;
		border: none !important;
		box-shadow: none !important;
		--toolbarbutton-inner-padding: var(--vt-toolbarbutton-inner-padding) !important;
	 	--toolbarbutton-outer-padding: 0 !important;
	 	--toolbarbutton-border-radius: 0 !important;
	}
	#vert_toolbar:not([customizing]) .toolbarbutton-1:hover {
		background-color: var(--vt-bg-color-hover) !important;
	}

	#vert_toolbar:not([customizing]).bar-left .toolbarbutton-1:first-of-type {
		border-top-right-radius: var(--vt-border-radius) !important;
		border-top-left-radius: 0 !important;
	}
	#vert_toolbar:not([customizing]).bar-right .toolbarbutton-1:first-of-type {
		border-top-right-radius: 0 !important;
		border-top-left-radius: var(--vt-border-radius)!important;
	}
	#vert_toolbar:not([customizing]).bar-left .toolbarbutton-1:last-of-type {
		border-bottom-left-radius: 0 !important;
		border-bottom-right-radius: var(--vt-border-radius) !important;
	}
	#vert_toolbar:not([customizing]).bar-right .toolbarbutton-1:last-of-type {
		border-bottom-right-radius: 0 !important;
		border-bottom-left-radius: var(--vt-border-radius) !important;
		}

	#vert_toolbar:not([customizing]) .toolbarbutton-1 .toolbarbutton-text {
		display: flex !important;
		opacity: 0 !important;
		transition: opacity .5s ease-in-out .2s !important;
		text-overflow: ellipsis !important;
		align-items: center !important;
		padding: 0 !important;
	 	border-radius: 0 !important;
	}
	#vert_toolbar:not([customizing]):hover .toolbarbutton-1 .toolbarbutton-text {
		opacity: 1 !important;
		transition: opacity .5s ease-in-out var(--vt-delay_min_max-width) !important;
	}
	#vert_toolbar[customizing] {
		min-height: 38px !important;
		min-width: 38px !important;
		max-width: 38px !important;
		margin-right: 0 !important;
		margin-left: 0 !important;
		padding-bottom: 38px !important;
		background: var(--vt-customizing-bg-color) !important;
		border: 1px dashed var(--vt-customizing-border-color) !important;
	}

	#vert_toolbar_button.bar-left .toolbarbutton-icon {
		transform: scaleX(-1) !important;
	}
	#vert_toolbar_button.bar-right .toolbarbutton-icon {
		transform: scaleX(1) !important;
	}
`;
const sss = Cc['@mozilla.org/content/style-sheet-service;1'].getService(Ci.nsIStyleSheetService);
const uri = makeURI('data:text/css;charset=UTF=8,' + encodeURIComponent(css));
sss.loadAndRegisterSheet(uri, sss.AUTHOR_SHEET);
};

css();

})();

Alles anzeigen

Rootbeitrag

Mitleser

Zitat

Gerade auf Linux in Nightly 146.0a1 erfolgreich getestet (benötigt Neustart).

Zitat von 2002Andreas

Aber nicht in allen Profilen

Ist hier (Linux) im letzten Nightly auch so...

EDIT: nach mehmaligem Neustart funktioniert es jetzt wieder.. mal abwarten....

Mitleser

Klaus Doldinger & Passport - Ataraxia

Externer Inhalt www.youtube.com

Inhalte von externen Seiten werden ohne deine Zustimmung nicht automatisch geladen und angezeigt.

Durch die Aktivierung der externen Inhalte erklärst du dich damit einverstanden, dass personenbezogene Daten an Drittplattformen übermittelt werden. Mehr Informationen dazu haben wir in unserer Datenschutzerklärung zur Verfügung gestellt.

Mitleser

Passport mit Doldinger war ein Idol meiner Jugend. Großartige Lebensleistung! Die Erinnerung bleibt.

Externer Inhalt www.youtube.com

Inhalte von externen Seiten werden ohne deine Zustimmung nicht automatisch geladen und angezeigt.

Durch die Aktivierung der externen Inhalte erklärst du dich damit einverstanden, dass personenbezogene Daten an Drittplattformen übermittelt werden. Mehr Informationen dazu haben wir in unserer Datenschutzerklärung zur Verfügung gestellt.

Mitleser

Zitat von Mira_Belle

Möchtest Du den Eintrag im Kontextmenü, ohne CSS, entfernen?
Ja, dann kannst Du auf "KI-Chatbot entfernen" klicken.

Ich bin ehrlich gesagt nun aber etwas irritiert. Entfernt dieser Klick NUR den Eintrag im Menü oder gleich den ganzen Bot? Und wenn ja, wie macht sich das bemerkbar?

Mitleser

Zitat von Mira_Belle

Ich hätte gerne

Mitleser

Zitat von Sören Hentzschel

Bei mir funktioniert der genannte Schalter in Firefox Nightly ohne sonstige Anpassungen auf macOS nicht.

Gerade auf Linux in Nightly 146.0a1 erfolgreich getestet (benötigt Neustart).

Mitleser

2002Andreas

1. true
2 .false

Mitleser

Zitat von lenny2

Im Kontextmenü der Tab bleiben derselbe Menüpunkt

Die Menüeinträge könnten auch so ausgeblendet werden: browser.ml.chat.menu, false .

Mitleser

Zitat von Endor

Achte mal darauf ob das, im Script und
bei den Ordnern übereinstimmt.
Nur ein Versuch.

Danke. Im Screen aus #154 kann man sehen, dass das so übereinstimmt. Es ist tatsächlich ein Problem irgendwo auf Systemebene; allerdings bisher nur mit genau Zeile 95 in genau dieser Datei. Mit dem Code hat das wohl nichts zu tun. Bei der 'alten' Datei aus #138 ist das allerdings nicht so. Ich finde das Script so wie es ist sehr funktionell und benutzerfreundlich und bin happy, dass es jetzt läuft.
EDIT: Ich vermute ein bufferoverflow (Arbeitsspeicher) und damit verbunden eine korrupte Auslagerungsdatei; aber ich bin dran...

Mitleser

Zitat von FuchsFan

Das habe ich mit anderen Namen (Ordner sind so vorhanden) unter Win11 ausprobiert, cssweb, cssshadow, und es funktioniert auch damit.

Danke fürs testen! Das habe ich mir schon fast gedacht. Liegt dann wohl doch irgendwie an Linux.
Das funktioniert:

Das nicht:

Ordner sind vorhanden:

EDIT: Scheint ein Cache-Problem meines Rechners zu sein! Nach mehrmaligem umbenennen sowie einiger Neustarts der Rechners geht es jetzt mit dem Ordnernamen css_test jedoch nicht mehr mit dem Namen css. Also genau umgekehrt.

SORRY!!!!!!!

Mitleser

Speravir Hallo! Alles auf Anfang!
Die gute Nachricht zuerst: Dein Script aus Beitrag #128 läuft auch auf Linux.
Der Fehler in deinem Script ist (und ich bin drauf reingefallen): In Zeile 95 (let cssFolder = "CSS";) ist es nicht möglich einen anderen Ordnernamen einzutragen.

Ich hatte vor dem ersten Start des Scriptes den Namen meines schon vorhandenen Testordners verwendet (css_test). Mit einem Ordner namens CSS funktioniert es nun endlich. 'Was lange währt wird endlich gut'.

EDIT: Beitrag ist obsolet; siehe Beitrag #154 !

Mitleser

Zitat von Mira_Belle

Verstehe ich jetzt nicht!

Bei den Beiträgen hier geht es um das Thema 'UserCSSLoader (2025)', somit bezog ich mich darauf:

Update usercssloader.uc.js · Endor8/userChrome.js@9642390

Aktualisierung von Speravir - camp-firefox.de

github.com

Mitleser

Zitat von Mira_Belle

schau Dir doch mal mein Appmenü-Skript an

Und das läuft auch auf Linux?
Das Script vom 30-9-25 läuft nicht auf Linux; die Vorgängerversion schon. Solltest du Quellcode aus der neuesten Version übernommen haben, hast du auch den Fehler kopiert.

Mitleser

2002Andreas

Beiträge von Mitleser

Schaltbare vertikale Overlay-Zusatzleiste

Schaltbare vertikale Overlay-Zusatzleiste

Schaltbare vertikale Overlay-Zusatzleiste

Schaltbare vertikale Overlay-Zusatzleiste

Seitennavigation - Fly Out Menü

Schaltbare vertikale Overlay-Zusatzleiste

Kontextmenüeintrag "Einen KI-Chatbot fragen" ausblenden

Was hört Ihr gerade?

In memoriam

Kontextmenüeintrag "Einen KI-Chatbot fragen" ausblenden

Kontextmenüeintrag "Einen KI-Chatbot fragen" ausblenden

Kontextmenüeintrag "Einen KI-Chatbot fragen" ausblenden

Kontextmenüeintrag "Einen KI-Chatbot fragen" ausblenden

Kontextmenüeintrag "Einen KI-Chatbot fragen" ausblenden

UserCSSLoader (2025)

UserCSSLoader (2025)

UserCSSLoader (2025)

UserCSSLoader (2025)

UserCSSLoader (2025)

Seitennavigation - Fly Out Menü