Beiträge von Mira_Belle

Mira_Belle

Zitat von Endor

Das einbinden von eigenen Symbolen für die Pfeile up.svg bzw. down.svg
funktioniert hier nicht. Das wäre wenn man hier
const custom_scrollbar_arrows_version = 1; auf 2 stellt.

Das steht doch auch so im Skript.

Code

  const custom_scrollbar_arrows_version = 1;            // default: custom_scrollbar_arrows_version = 1
                                                        //  1 ==> SVG arrows as code: might not work on some pages
                                                        //  2 ==> SVG arrows as files: placed inside 'chrome\icons' folder

1 => interner Code
2=> externe Symbole

Eventuell sollte ich da noch einen deutschen Kommentar einbauen, dass entweder der Pfad zu den Symbolen angepasst werden muss, oder dass die Symbole, wie immer in "meinen" Skripts, in einem Ordner mit dem Namen "icons" sich unter "chrome"
im Profilverzeichnis befinden muss.

Mira_Belle

Zitat von edvoldi

Entschuldigung ich habe scheinbar etwas falsche gespeichert.
Jetzt funktioniert es.

Phü, da habe ich aber schon das Schwitzen angefangen.
Gut das es sich jetzt geklärt hat.

Mira_Belle

Zitat von 2002Andreas

gerne doch, wenn du dir schon so viel Mühe gibst

Ich nutze das Skript ja auch selbst, da hänge ich noch mal so dolle rein.
Und das ganze, dieses Mal ohne KI, möchte ich nur mal erwähnen, für alle, die das immer für'n Ar..... finden.

Mein Dank gilt aber auch lenny. Ohne "sein" CSS wäre ich nie auf die Lösung gekommen.

Zitat von edvoldi

Wenn ich mit der Maus über die Pfeile gehe verschwinden sie, soll das so sein?
Gruß
EDV-Oldie

Äh, nö. Hast Du das Skript einfach so übernommen, oder selber Farben definiert?
Du musst Dich schon mal mit der Konfiguration beschäftigen, denn je nach Themes kann es schon zu solchen Effekten kommen.

Mira_Belle

2002Andreas Danke. Mir scheint, es funktioniert jetzt wieder alles.

Mira_Belle

1. Was für eine Page ist das? Finde das ziemlich cool.
2. Schaut doch recht gut aus.

Von lenny möchte ich jetzt wissen, ob das auch in seinem spetiellen Fall, Ordner mit Scrollbar, funktioniert.

Und Andy, die Pfeile hast Du nicht eingebunden? Mal custom_scrollbar_arrows_version auf 1 gestellt?

Mira_Belle

Final

Bitte nochmals testen, nur für alle Fälle.
Bei meinen Tests ist mir kein Fehler mehr aufgefallen.
Aber, ich bin ja auch blind auf meinem Hühnerauge.

CSS

// Scrollbar.uc.js

"use strict";
/* Firefox userChrome.js tweaks - 'Custom Scrollbars' for Firefox ************************************************************ */
/* Original by Aris (aris-addons@gmx.net)************************************************************************************* */
/* Github: https://github.com/Aris-t2/CustomJSforFx/blob/master/scripts/custom_scrollbars.uc.js
/* *************************************************************************************************************************** */
/* Customized by Mira********************************************************************************************************* */
/* https://www.camp-firefox.de/forum/thema/135133-custom-scrollbars-uc-js-anpassen/ ****************************************** */
/* Scrollbar.v1.0.6.js    https://www.camp-firefox.de/forum/thema/135133/?postID=1207718#post1207718************************** */
/* https://www.camp-firefox.de/forum/thema/136152/?postID=1222989#post1222989************************************************* */
/* Scrollbar.v2.0.2.js    https://www.camp-firefox.de/forum/thema/136167/?postID=1223096#post1223096************************** */
/* Scrollbar.v2.0.3.js    https://www.camp-firefox.de/forum/thema/136167/?postID=1223124#post1223124************************** */
/* Scrollbar.v2.0.5.js    https://www.camp-firefox.de/forum/thema/136167/?postID=1223143#post1223143************************** */
/* Scrollbar.v2.0.6.1.js  https://www.camp-firefox.de/forum/thema/136167/?postID=1223162#post1223162************************** */
/* Scrollbar.v2.0.7.js	  https://www.camp-firefox.de/forum/thema/139766/?postID=1278242#post1278242************************** */
/* *************************************************************************************************************************** */
/* Custom Scrollbars for Firefox ********************************************************************************************* */
/* Version: 2.0.7 Final for Firefox 143+ ************************************************************************************* */
/* ******************************************************************************************************************************

README

  about:config >
    widget.windows.overlay-scrollbars.enabled > false (Windows)
    widget.gtk.overlay-scrollbars.enabled > false (Linux)
  [!] The above preferences have to be set to 'false' for this code to work
 
  [!] DER STARTUP-CACHE MUSS NACH JEDER ÄNDERUNG GELÖSCHT WERDEN!
  -> Ordner 'startupCache' finden: Adressleiste > about:profiles > Lokales Verzeichnis > Ordner öffnen > startupCache
  -> Firefox schließen
  -> Inhalt des 'startupCache'-Ordners löschen

  Alternativ mit einem JavaScipt!
  -> https://github.com/Endor8/userChrome.js/blob/master/Firefox%2087/RestartFirefoxButtonM.uc.js
 
  Anpassungen vornehmen > Werte ändern
  - Optionen aktivieren/deaktivieren: true <-> false
  - Farbe
    - Name: red, blue, transparent 
    - Hexcode: #33CCFF, #FFF
    - rgb(a): rgba(0,0,255,0.8)
    - hsl(a): hsla(240,100%,50%,0.8)
  - Zahlen: 1, 2, 3 ... 10, 11, 12 ...
  - Deckkraft (in Dezimalzahlen): 0.0 bis 1.0 z.B. 1.4 oder 1.75
  - Farbverläufe: linear-gradient(direction, color, color, color)
  - Beispiel für Farbverläufe: linear-gradient(to right, blue, #33CCFF, rgba(0,0,255,0.8))
  - vordefinierte Farbverläufe: transparent,rgba(255,255,255,0.5),transparent -> transparent,rgba(255,255,255,0.0),transparent
  - keine Farbe oder keine Farbwerte -> verwende "unset"
*/
/* *************************************************************************************************************************** */

(function() {

  /* **** Konfiguration **** */

  // PROFILE PHATH "CALCULATE"
  let ProfileDirectory = PathUtils.toFileURI(PathUtils.join(PathUtils.profileDir, 'chrome', 'icons'));

  // GENERAL SCROLLBAR SETTINGS
  const hide_scrollbars = false;                		// default: hide_scrollbars = false
  const hide_scrollbar_buttons = false;         		// default: hide_scrollbar_buttons = false
  const thin_scrollbars = false;                		// default: thin_scrollbars = false / browsers own way to show thin scrollbars
  const custom_scrollbar_opacity = false;        		// default: custom_scrollbar_opacity = false
  const custom_opacity_value = "1.0";           		// default: custom_opacity_value = "1.0"

  // CUSTOM SCROLLBAR SETTINGS ("custom_scrollbar_" --> "cs_")
  const custom_scrollbars = true;                       // default: custom_scrollbars = true
  const custom_scrollbar_arrows = true;                 // default: custom_scrollbar_arrows = true
  const custom_scrollbar_arrows_version = 2;            // default: custom_scrollbar_arrows_version = 1
                                                        //  1 ==> SVG arrows as code: might not work on some pages
                                                        //  2 ==> SVG arrows as files: placed inside 'chrome\icons' folder

  // only for 'custom_scrollbar_arrows_version = 1'
  const custom_scrollbar_arrows_color = "%23bfbfbf";     // default: custom_scrollbar_arrows_color = "grey"; / # ==> %23 e.g. #33CCFF ==> %2333CCFF
  const custom_scrollbar_arrows_hover_color = "%23ffae00";   // default: custom_scrollbar_arrows_hover_color = "orange"; # ==> %23

  const cs_thumb_border = 1;                            // default: cs_thumb_border = 0 / in px 1
  const cs_thumb_roundness = 26;                         // default: cs_thumb_roundness = 0 / in px 9
  const cs_buttons_border = 0;                          // default: cs_buttons_border = 0 / in px
  const cs_buttons_roundness = 0;                       // default: cs_buttons_roundness = 0 / in px
  const cs_thumb_minimal_size = 17;                     // default: cs_thumb_minimal_size = 17; / in px
  const cs_ignore_color_gradients = false;               // default: cs_ignore_color_gradients = false / 'flat' scrollbars

  // CUSTOM SCROLLBAR COLORS/GRADIENTS
  // - background
  const cs_background_color = "#AEC5FA";                // default: cs_background_color = "#DDDDDD"
  let cs_background_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)";           // default: cs_background_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)"
  let cs_background_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)";         // default: cs_background_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)"
  const cs_background_roundness = 26;					// default: cs_background_roundness = 0 / in px
  // - corner
  const cs_corner_background_color = "#CCCCCC";         // default: cs_corner_background_color = "#DDDDDD" / - corner
  let cs_corner_background_image = "linear-gradient(45deg,transparent 30%,rgba(255,255,255,0.5) 50%,transparent 70%),linear-gradient(-45deg,transparent 30%,rgba(255,255,255,0.5) 50%,transparent 70%)";             // default: cs_corner_background_image = "linear-gradient(45deg,transparent 30%,rgba(255,255,255,0.5) 50%,transparent 70%),linear-gradient(-45deg,transparent 30%,rgba(255,255,255,0.5) 50%,transparent 70%)"
  // - thumb/slider
  const cs_thumb_color = "#33CCFF";                     // default: cs_thumb_color = "#33CCFF" / thumb/slider
  let cs_thumb_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)";                // default: cs_thumb_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)"
  let cs_thumb_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)";              // default: cs_thumb_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)"
  const cs_thumb_hover_color = "#66FFFF";                // default: cs_thumb_hover_color = "#66FFFF"
  let cs_thumb_hover_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)";          // default: cs_thumb_hover_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)"
  let cs_thumb_hover_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)";        // default: cs_thumb_hover_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)"
  const cs_thumb_border_color = "#33CCFF";              // default: cs_thumb_border_color = "#33CCFF"
  // - buttons
  let cs_button_size = 26;									// in px // default: cs_button_size = 17
  const cs_buttons_color = "Bahama Blue";                   // default: cs_buttons_color = "#66FFFF" "#5b5b66"/ buttons
  let cs_buttons_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)";              // default: cs_buttons_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)"
  let cs_buttons_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)";            // default: cs_buttons_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)"
  const cs_buttons_hover_color = "#bfffff";             // default: cs_buttons_hover_color = "#33CCFF"
  const cs_buttons_border_color = "#33CCFF";            // default: cs_buttons_border_color = "#33CCFF" "#5b5b66"
  let cs_buttons_hover_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)";        // default: cs_buttons_hover_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)"
  let cs_buttons_hover_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)";      // default: cs_buttons_hover_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)"

  /* **** Ende Konfiguration **** */

/* *************************************************************************************************************************** */

  // unset background image color gradients -> flat scrollbars
  if(cs_ignore_color_gradients === true)
	cs_background_image_vertical
	= cs_background_image_horizontal
	= cs_corner_background_image
	= cs_thumb_image_vertical
	= cs_thumb_image_horizontal
	= cs_thumb_hover_image_vertical
	= cs_thumb_hover_image_horizontal
	= cs_buttons_image_vertical
	= cs_buttons_image_horizontal
	= cs_buttons_hover_image_vertical
	= cs_buttons_hover_image_horizontal
	= "unset";

  let custom_scrollbars_code='';
  let custom_scrollbar_arrows_code='';
  let hide_scrollbar_buttons_code='';
  let custom_scrollbar_opacity_code='';
  let hide_scrollbars_code='';
  let thin_scrollbars_code='';
  
  if(custom_scrollbars === true)
	custom_scrollbars_code=`
		scrollcorner,
  		scrollbar > slider, 
		scrollbar > slider > thumb, 
		scrollbar > scrollbarbutton {
		/*  appearance: auto; */
		  -moz-default-appearance: none !important;
		}
		scrollbar > slider {
		  background-color: ${cs_background_color} !important;
		  background-image: ${cs_background_image_horizontal} !important;
		  border-radius: ${cs_background_roundness}px !important;
		}
		scrollbar[vertical] > slider {
		  background-image: ${cs_background_image_vertical} !important;
		  border-radius: ${cs_background_roundness}px !important;
		}
		scrollcorner {
		  background-color: ${cs_corner_background_color} !important;
		  background-image: ${cs_corner_background_image} !important;
		}
		scrollbar > slider > thumb {
		  background-color: ${cs_thumb_color} !important;
		  border-radius: ${cs_thumb_roundness}px !important;
		  box-shadow: inset 0 0 0 ${cs_thumb_border}px ${cs_thumb_border_color} !important;
		}
		scrollbar[vertical] > slider > thumb {
		  background-image: ${cs_thumb_image_vertical} !important;
		  min-height: ${cs_thumb_minimal_size}px !important;
		}
		scrollbar > slider > thumb {
		  background-image: ${cs_thumb_image_horizontal} !important;
		  min-width: ${cs_thumb_minimal_size}px !important;
		}
		scrollbar > slider > thumb:hover, scrollbar > slider > thumb:active {
		  background-color: ${cs_thumb_hover_color} !important;
		}
		scrollbar > slider > thumb[vertical]:hover, scrollbar > slider > thumb[vertical]:active {
		  background-image: ${cs_thumb_hover_image_vertical} !important;
		}
		scrollbar > slider > thumb[horizontal]:hover, scrollbar > slider > thumb[horizontal]:active {
		  background-image: ${cs_thumb_hover_image_horizontal} !important;
		}
		scrollbar > scrollbarbutton {
		  background-color: ${cs_buttons_color} !important;
		  border-radius: ${cs_buttons_roundness}px !important;
		  box-shadow: inset 0 0 0 ${cs_buttons_border}px ${cs_buttons_border_color} !important;
		  height: 17px !important;
		  width: 17px !important;
		}
		scrollbar[vertical] scrollbarbutton {
		  background-image: ${cs_buttons_image_vertical} !important;
		}
		scrollbar[horizontal] scrollbarbutton {
		  background-image: ${cs_buttons_image_horizontal} !important;
		}
		scrollbar > scrollbarbutton:hover {
		  background-color: ${cs_buttons_hover_color} !important;
		}
		scrollbar[vertical] scrollbarbutton:hover {
		  background-image: ${cs_buttons_hover_image_vertical} !important;
		}
		scrollbar[horizontal] scrollbarbutton:hover {
		  background-image: ${cs_buttons_hover_image_horizontal} !important;
		}
	`;
	
  if(custom_scrollbar_arrows === true && custom_scrollbar_arrows_version === 1)
	custom_scrollbar_arrows_code=`

		scrollbar > scrollbarbutton {
		  background-repeat: no-repeat !important;
		  background-position: center center !important;
		}
		scrollbar[vertical] > scrollbarbutton[type="decrement"] {
		  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='${custom_scrollbar_arrows_color}' %3E%3Cpath d='m7.247 4.86-4.796 5.481c-.566.647-.106 1.659.753 1.659h9.592a1 1 0 0 0 .753-1.659l-4.796-5.48a1 1 0 0 0-1.506 0z'/%3E%3C/svg%3E ") !important;
		}
		scrollbar[vertical] > scrollbarbutton[type="increment"] {
		  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='${custom_scrollbar_arrows_color}' %3E%3Cpath d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3E%3C/svg%3E ") !important;
		}
		scrollbar > scrollbarbutton[type="decrement"] {
		  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='${custom_scrollbar_arrows_color}' %3E%3Cpath d='m3.86 8.753 5.482 4.796c.646.566 1.658.106 1.658-.753V3.204a1 1 0 0 0-1.659-.753l-5.48 4.796a1 1 0 0 0 0 1.506z'/%3E%3C/svg%3E ") !important;
		}
		scrollbar > scrollbarbutton[type="increment"] {
		  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='${custom_scrollbar_arrows_color}' %3E%3Cpath d='m12.14 8.753-5.482 4.796c-.646.566-1.658.106-1.658-.753V3.204a1 1 0 0 1 1.659-.753l5.48 4.796a1 1 0 0 1 0 1.506z'/%3E%3C/svg%3E ") !important;
		}
		
        scrollbar[vertical] > scrollbarbutton[type="decrement"]:hover {
          background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='`+custom_scrollbar_arrows_hover_color+`' %3E%3Cpath d='m7.247 4.86-4.796 5.481c-.566.647-.106 1.659.753 1.659h9.592a1 1 0 0 0 .753-1.659l-4.796-5.48a1 1 0 0 0-1.506 0z'/%3E%3C/svg%3E ") !important;
          background-repeat: no-repeat !important;
          background-position: top !important;
        }
        scrollbar[vertical] > scrollbarbutton[type="increment"]:hover {
          background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='`+custom_scrollbar_arrows_hover_color+`' %3E%3Cpath d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3E%3C/svg%3E ") !important;
          background-repeat: no-repeat !important;
          background-position: bottom !important;
        }
        scrollbar > scrollbarbutton[type="decrement"]:hover {
          background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='`+custom_scrollbar_arrows_hover_color+`' %3E%3Cpath d='m3.86 8.753 5.482 4.796c.646.566 1.658.106 1.658-.753V3.204a1 1 0 0 0-1.659-.753l-5.48 4.796a1 1 0 0 0 0 1.506z'/%3E%3C/svg%3E ") !important;
          background-repeat: no-repeat !important;
          background-position: left !important;
        }
        scrollbar > scrollbarbutton[type="increment"]:hover {
          background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='`+custom_scrollbar_arrows_hover_color+`' %3E%3Cpath d='m12.14 8.753-5.482 4.796c-.646.566-1.658.106-1.658-.753V3.204a1 1 0 0 1 1.659-.753l5.48 4.796a1 1 0 0 1 0 1.506z'/%3E%3C/svg%3E ") !important;
          background-repeat: no-repeat !important;
          background-position: right !important;
        }
	`;
  else if(custom_scrollbar_arrows === true && custom_scrollbar_arrows_version === 2)
	custom_scrollbar_arrows_code=`
		scrollbar > scrollbarbutton {
		  background-repeat: no-repeat !important;
		  background-position: center center !important;
		}
		scrollbar[vertical] > scrollbarbutton[type="decrement"] {
		  background-image: url("${ProfileDirectory}/Chevron-up_hellgrau.svg") !important;
		}
		scrollbar[vertical] > scrollbarbutton[type="increment"] {
		  background-image: url("${ProfileDirectory}/Chevron-down_hellgrau.svg") !important;
		}
		scrollbar > scrollbarbutton[type="decrement"] {
		  background-image: url("${ProfileDirectory}/Chevron-left_hellgrau.svg") !important;
		}
		scrollbar > scrollbarbutton[type="increment"] {
		  background-image: url("${ProfileDirectory}/Chevron-right_hellgrau.svg") !important;
		}

		/* Hover */

		scrollbar[vertical] > scrollbarbutton[type="decrement"]:hover {
		  background-image: url("${ProfileDirectory}/Chevron-up_orange.svg") !important;
		}
		scrollbar[vertical] > scrollbarbutton[type="increment"]:hover {
		  background-image: url("${ProfileDirectory}/Chevron-down_orange.svg") !important;
		}
		scrollbar > scrollbarbutton[type="decrement"]:hover {
		  background-image: url("${ProfileDirectory}/Chevron-left_orange.svg") !important;
		}
		scrollbar > scrollbarbutton[type="increment"]:hover {
		  background-image: url("${ProfileDirectory}/Chevron-right_orange.svg") !important;
		}

		scrollbar > scrollbarbutton {
			min-width: ${cs_button_size}px !important;
			min-height: ${cs_button_size}px !important;
		}
	`;

  if(hide_scrollbar_buttons === true)
	hide_scrollbar_buttons_code=`
		scrollbar > scrollbarbutton {
		  opacity: 0 !important;
		}
		scrollbar[vertical] > scrollbarbutton {
		  min-height: 1px !important;
		  height: 1px !important;
		  max-height: 1px !important;
		}
		scrollbar[horizontal] > scrollbarbutton {
		  min-width: 1px !important;
		  width: 1px !important;
		  max-width: 1px !important;
		}
	`;
	
  if(custom_scrollbar_opacity === true)
	custom_scrollbar_opacity_code=`
		scrollbar {
		  opacity: ${custom_opacity_value} !important;
		}
	`;
  
  if(hide_scrollbars === true)
	hide_scrollbars_code=`
		scrollbar, scrollcorner {
		  display: none !important;
		  visibility: collapse !important;
		}
	`;
  
  if(thin_scrollbars === true)
	thin_scrollbars_code=`
		:root{
		  scrollbar-width: thin !important;
		}
		scrollbar[vertical] > scrollbarbutton {
		  height: 14px !important;
		  width: 7px !important;
		}
		scrollbar[horizontal] > scrollbarbutton {
		  height: 7px !important;
		  width: 14px !important;
		}
	`;

  Components.classes["@mozilla.org/content/style-sheet-service;1"]
    .getService(Components.interfaces.nsIStyleSheetService)
	  .loadAndRegisterSheet(Services.io.newURI("data:text/css;charset=utf-8," + encodeURIComponent(`
		${custom_scrollbars_code}
		${custom_scrollbar_arrows_code}
		${hide_scrollbar_buttons_code}
		${custom_scrollbar_opacity_code}
		${hide_scrollbars_code}
		${thin_scrollbars_code}
  `), null, null),
  Components.classes["@mozilla.org/content/style-sheet-service;1"]
    .getService(Components.interfaces.nsIStyleSheetService).AGENT_SHEET);


})();

Alles anzeigen

Noch jemand da?
ArisCTR

Kann jemand bitte das Skript testen?

2002Andreas Boersenfeger Endor Mitleser grisu2099 lenny2

Mira_Belle

2002Andreas Eine Sache noch, wird die horizontale Scrollbar den richtig angezeigt?

lenny2 Danke, vielen Dank. Habe in meinem Skript zumindest den Schieber jetzt mit Farbverlauf.

Mira_Belle

2002Andreas Komisch.
Hast Du das CSS und das JS einfach so genommen, oder irgendetwas verändert?

Mira_Belle

lenny2 Nur weil ich wissbegierig bin habe ich es in der Nightly ausprobiert.

Im CSS sind Fehler! Zeile 7, 57, 82 & 87.
Nicht ); !important; sondern ) !important;

Ohne agent-sheet.js tut sich nichts, was auch klar ist, aber mit eben auch nichts!

Zitat von lenny2

/* Use with agent-sheet-scrollbar.js */
/* Set your choice in about:config: widget.non-native-theme.scrollbar.style > 0, 1, 2, 3, 4 or 5 */

Steht bei mir auf 0

Ich mag in about:config nicht gerne Einstellungen verändern! Nur, wenn es absolut nicht anders geht.

Nachtrag!

Ich bin mir auch absolut sicher, dass auch hier in diesem CSS die Änderungen von
[orient="vertical"] & [orient="horizontal"] zu [vertical] & [horizontal] gemacht werden müssen.

Bei [disabled="true"], [orientation="right"] & [orientation="left"] bin ich mir nicht sicher.
Müsste man testen oder in den Untiefen des Firefox in Erfahrung bringen.

Mira_Belle

lenny2 Das mit dem Radius lässt sich in der Konfiguration einstellen.

Dass in den Ordnern die Scrollbar nicht richtig funktioniert, hat für mich erst einmal keine Priorität.
Denn die muss man erst per Anpassung sich "erschaffen"!

Der Fehler, den Du in der Animation zeigst, den habe ich bisher noch nicht gesehen.

Aber da die Scrolleisten z.Z. scheinbar eine Baustelle seitens Mozilla sind, muss ich wohl geduldig sein.

Mira_Belle

Sorry, die Beschreibung von mir war schlecht!

Aussehen tut es auch bei mir in der Nightly so!
Nur klicke mal auf einen "Eintrag".
Öffnet sich da bei Dir der Tab?

Mira_Belle

2002Andreas Danke.
Also schon ab der 143 das gleiche Problem.

Mira_Belle

In der Nightly 144 funktioniert dieses Skript nicht mehr!

JavaScript

// newTabButtonUndoTabList.uc.js

"use strict";
/* ******************************************************************************************************** */
/* Beschreibung                                                                                             */
/* Bei Rechtsklick auf die Neuen Tab Schaltfläche, wird im Kontextmenü,                                     */
/* der Eintrag zum Wiederherstellen des zuletzt geschlossenen Tabs angezeigt.                               */
/* Customized by BrokenHeart                                                                                */
/*                                                                                                          */
/* https://www.camp-firefox.de/forum/thema/112673/?postID=1223733#post1223733                               */
/* https://www.camp-firefox.de/forum/thema/112673/?postID=1228286#post1228286                               */
/*                                                                                                          */
/* ******************************************************************************************************** */

(function () {

    if (!window.gBrowser){
        return;
    }
    
    gBrowser.tabContainer.addEventListener('click', function (e) {
        if (e.originalTarget.id != 'tabs-newtab-button') return;
        switch (e.button) {
            case 1:
                undoCloseTab(0);
                break;
            case 2:
                UCT.makePopup(e);
                e.preventDefault();
                break;
        }
    }, false);

})();

var UCT = {
    init: function () {
        var mp = document.createXULElement("menupopup");
        mp.id = "undo-close-tab-list";
        mp.addEventListener('popupshowing', function(event) {
			UCT.onpopupshowing(event);
		}, true);		
        mp.setAttribute("placespopup", true);
        mp.setAttribute("tooltip", "bhTooltip");
        mp.setAttribute("popupsinherittooltip", true);
        document?.getElementById("mainPopupSet")?.appendChild(mp);
    },

    makePopup: function (e) {
        if (SessionStore.getClosedTabCountForWindow(window) != 0) {
            document.getElementById("undo-close-tab-list").openPopupAtScreen(e.screenX +2, e.screenY +2, false);
        }
        else
        {
            console.log("--- Es gibt keinen Tab, der wiederhergestellt werden kann ---");
        }
    },

    onpopupshowing: function (e) {
        var popup = e.target;
        var m;
        while (popup.hasChildNodes())
            popup.removeChild(popup.firstChild);

        let undoItems = SessionStore.getClosedTabDataForWindow(window);
        undoItems.map(function (item, id) {
          //  var m = document.createXULElement('menuitem');
            m = document.createXULElement("menuitem");
            m.setAttribute('label', item.title);
            m.setAttribute('image', item.image);
            m.setAttribute('class', 'menuitem-iconic bookmark-item');            
            m.addEventListener('command', () => {
                    undoCloseTab(id);
                }
            );
            popup.appendChild(m);
        });

        popup.appendChild(document.createXULElement("menuseparator"));
        m = document.createXULElement("menuitem");
        m.setAttribute("label", "Chronik in der Sidebar öffnen");
        m.setAttribute("image", "chrome://browser/skin/history.svg");
        m.setAttribute("class", "menuitem-iconic");
		m.addEventListener('command', function() {
			SidebarController.toggle('viewHistorySidebar');
		}, true);		
        popup.appendChild(m);
    },
};

setTimeout(function() {
      UCT.init();
  },250);

Alles anzeigen

Kann das jemand bestätigen und kann das jemand auch in der 143 überprüfen?
Danke

Mira_Belle

Und hier "meine" Version 2.0.7 RC3 for Firefox 143+

Die Geschichte des Farbverlaufs und der fehlenden Pfeile in der horizontalen Scrollbar scheint am Firefox zu liegen.
Kann jemand mal das Skript, so wie es ist, im Firefox 143 testen? Danke.

JavaScript

// Scrollbar.uc.js

"use strict";
/* Firefox userChrome.js tweaks - 'Custom Scrollbars' for Firefox ************************************************************ */
/* Original by Aris (aris-addons@gmx.net)************************************************************************************* */
/* Github: https://github.com/Aris-t2/CustomJSforFx/blob/master/scripts/custom_scrollbars.uc.js
/* *************************************************************************************************************************** */
/* Customized by Mira********************************************************************************************************* */
/* https://www.camp-firefox.de/forum/thema/135133-custom-scrollbars-uc-js-anpassen/ ****************************************** */
/* Scrollbar.v1.0.6.js    https://www.camp-firefox.de/forum/thema/135133/?postID=1207718#post1207718************************** */
/* https://www.camp-firefox.de/forum/thema/136152/?postID=1222989#post1222989************************************************* */
/* Scrollbar.v2.0.2.js    https://www.camp-firefox.de/forum/thema/136167/?postID=1223096#post1223096************************** */
/* Scrollbar.v2.0.3.js    https://www.camp-firefox.de/forum/thema/136167/?postID=1223124#post1223124************************** */
/* Scrollbar.v2.0.5.js    https://www.camp-firefox.de/forum/thema/136167/?postID=1223143#post1223143************************** */
/* Scrollbar.v2.0.6.1.js  https://www.camp-firefox.de/forum/thema/136167/?postID=1223162#post1223162************************** */
/* *************************************************************************************************************************** */
/* Custom Scrollbars for Firefox ********************************************************************************************* */
/* Version: 2.0.7 RC3 for Firefox 143+ *************************************************************************************** */
/* ******************************************************************************************************************************

README

  about:config >
    widget.windows.overlay-scrollbars.enabled > false (Windows)
    widget.gtk.overlay-scrollbars.enabled > false (Linux)
  [!] The above preferences have to be set to 'false' for this code to work
 
  [!] DER STARTUP-CACHE MUSS NACH JEDER ÄNDERUNG GELÖSCHT WERDEN!
  -> Ordner 'startupCache' finden: Adressleiste > about:profiles > Lokales Verzeichnis > Ordner öffnen > startupCache
  -> Firefox schließen
  -> Inhalt des 'startupCache'-Ordners löschen

  Alternativ mit einem JavaScipt!
  -> https://github.com/Endor8/userChrome.js/blob/master/Firefox%2087/RestartFirefoxButtonM.uc.js
 
  Anpassungen vornehmen > Werte ändern
  - Optionen aktivieren/deaktivieren: true <-> false
  - Farbe
    - Name: red, blue, transparent 
    - Hexcode: #33CCFF, #FFF
    - rgb(a): rgba(0,0,255,0.8)
    - hsl(a): hsla(240,100%,50%,0.8)
  - Zahlen: 1, 2, 3 ... 10, 11, 12 ...
  - Deckkraft (in Dezimalzahlen): 0.0 bis 1.0 z.B. 1.4 oder 1.75
  - Farbverläufe: linear-gradient(direction, color, color, color)
  - Beispiel für Farbverläufe: linear-gradient(to right, blue, #33CCFF, rgba(0,0,255,0.8))
  - vordefinierte Farbverläufe: transparent,rgba(255,255,255,0.5),transparent -> transparent,rgba(255,255,255,0.0),transparent
  - keine Farbe oder keine Farbwerte -> verwende "unset"
*/
/* *************************************************************************************************************************** */
(function() {

  // PROFILE PHATH "CALCULATE"
  let ProfileDirectory = PathUtils.toFileURI(PathUtils.join(PathUtils.profileDir, 'chrome', 'icons'));

  // GENERAL SCROLLBAR SETTINGS
  const custom_scrollbar_size_value = 17;               // in px // default: custom_scrollbar_size_value = 17
  const hide_scrollbars = false;                		// default: hide_scrollbars = false
  const hide_scrollbar_buttons = false;         		// default: hide_scrollbar_buttons = false
  const thin_scrollbars = false;                		// default: thin_scrollbars = false / browsers own way to show thin scrollbars
  const custom_scrollbar_opacity = false;        		// default: custom_scrollbar_opacity = false
  const custom_opacity_value = "1.0";           		// default: custom_opacity_value = "1.0"

  // CUSTOM SCROLLBAR SETTINGS ("custom_scrollbar_" --> "cs_")
  const custom_scrollbars = true;                       // default: custom_scrollbars = true
  const custom_scrollbar_arrows = true;                 // default: custom_scrollbar_arrows = true
  const custom_scrollbar_arrows_version = 1;            // default: custom_scrollbar_arrows_version = 1
                                                        //  1 ==> SVG arrows as code: might not work on some pages
                                                        //  2 ==> SVG arrows as files: placed inside 'chrome\icons' folder

  // only for 'custom_scrollbar_arrows_version = 1'
  const custom_scrollbar_arrows_color = "%23bfbfbf";     // default: custom_scrollbar_arrows_color = "grey"; / # ==> %23 e.g. #33CCFF ==> %2333CCFF
  const custom_scrollbar_arrows_hover_color = "%23ffae00";   // default: custom_scrollbar_arrows_hover_color = "orange"; # ==> %23

  const cs_thumb_border = 1;                            // default: cs_thumb_border = 0 / in px 1
  const cs_thumb_roundness = 26;                         // default: cs_thumb_roundness = 0 / in px 9
  const cs_buttons_border = 0;                          // default: cs_buttons_border = 0 / in px
  const cs_buttons_roundness = 0;                       // default: cs_buttons_roundness = 0 / in px
  const cs_thumb_minimal_size = 12;                     // default: cs_thumb_minimal_size = 12; / in px
  const cs_ignore_color_gradients = false;               // default: cs_ignore_color_gradients = false / 'flat' scrollbars

  // CUSTOM SCROLLBAR COLORS/GRADIENTS
  // - background
  const cs_background_color = "#AEC5FA";                // default: cs_background_color = "#DDDDDD"
  let cs_background_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)";           // default: cs_background_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)"
  let cs_background_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)";         // default: cs_background_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)"
  let cs_arrows_on_buttons_buttons_size = 1.0;          // default: cs_arrows_on_buttons_buttons_size = 1.0
  const cs_background_roundness = 26;
  // - corner
  const cs_corner_background_color = "#CCCCCC";         // default: cs_corner_background_color = "#DDDDDD" / - corner
  let cs_corner_background_image = "linear-gradient(45deg,transparent 30%,rgba(255,255,255,0.5) 50%,transparent 70%),linear-gradient(-45deg,transparent 30%,rgba(255,255,255,0.5) 50%,transparent 70%)";             // default: cs_corner_background_image = "linear-gradient(45deg,transparent 30%,rgba(255,255,255,0.5) 50%,transparent 70%),linear-gradient(-45deg,transparent 30%,rgba(255,255,255,0.5) 50%,transparent 70%)"
  // - thumb/slider
  const cs_thumb_color = "#33CCFF";                     // default: cs_thumb_color = "#33CCFF" / thumb/slider
  let cs_thumb_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)";                // default: cs_thumb_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)"
  let cs_thumb_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)";              // default: cs_thumb_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)"
  const cs_thumb_hover_color = "#66FFFF";                // default: cs_thumb_hover_color = "#66FFFF"
  let cs_thumb_hover_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)";          // default: cs_thumb_hover_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)"
  let cs_thumb_hover_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)";        // default: cs_thumb_hover_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)"
  const cs_thumb_border_color = "#33CCFF";              // default: cs_thumb_border_color = "#33CCFF"
  // - buttons
  const cs_buttons_color = "Bahama Blue";                   // default: cs_buttons_color = "#66FFFF" "#5b5b66"/ buttons
  let cs_buttons_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)";              // default: cs_buttons_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)"
  let cs_buttons_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)";            // default: cs_buttons_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)"
  const cs_buttons_hover_color = "#bfffff";             // default: cs_buttons_hover_color = "#33CCFF"
  const cs_buttons_border_color = "#33CCFF";            // default: cs_buttons_border_color = "#33CCFF" "#5b5b66"
  let cs_buttons_hover_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)";        // default: cs_buttons_hover_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)"
  let cs_buttons_hover_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)";      // default: cs_buttons_hover_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)"

/* *************************************************************************************************************************** */

  // unset background image color gradients -> flat scrollbars
  if(cs_ignore_color_gradients === true)
	cs_background_image_vertical
	= cs_background_image_horizontal
	= cs_corner_background_image
	= cs_thumb_image_vertical
	= cs_thumb_image_horizontal
	= cs_thumb_hover_image_vertical
	= cs_thumb_hover_image_horizontal
	= cs_buttons_image_vertical
	= cs_buttons_image_horizontal
	= cs_buttons_hover_image_vertical
	= cs_buttons_hover_image_horizontal
	= "unset";

  let custom_scrollbars_code='';
  let custom_scrollbar_arrows_code='';
  let hide_scrollbar_buttons_code='';
  let custom_scrollbar_opacity_code='';
  let hide_scrollbars_code='';
  let thin_scrollbars_code='';
  
  if(custom_scrollbars === true)
	custom_scrollbars_code=`
		slider, scrollcorner, scrollbar thumb, scrollbar scrollbarbutton {
		  appearance: auto;
		  -moz-default-appearance: none !important;
		}
		slider {
		  background-color: ${cs_background_color} !important;
		}
		scrollbar[vertical] slider {
		  background-image: ${cs_background_image_vertical} !important;
		  border-radius: ${cs_background_roundness}px !important;
		}
		scrollbar[horizontal] slider {
		  background-image: ${cs_background_image_horizontal} !important;
		  border-radius: ${cs_background_roundness}px !important;
		}
		scrollcorner {
		  background-color: ${cs_corner_background_color} !important;
		  background-image: ${cs_corner_background_image} !important;
		}
		scrollbar thumb {
		  background-color: ${cs_thumb_color} !important;
		  border-radius: ${cs_thumb_roundness}px !important;
		  box-shadow: inset 0 0 0 ${cs_thumb_border}px ${cs_thumb_border_color} !important;
		}
		scrollbar thumb[vertical] {
		  background-image: ${cs_thumb_image_vertical} !important;
		  min-height: 17px !important;
		}
		scrollbar thumb[horizontal] {
		  background-image: ${cs_thumb_image_horizontal} !important;
		  min-width: 17px !important;
		}
		scrollbar thumb:hover, scrollbar thumb:active {
		  background-color: ${cs_thumb_hover_color} !important;
		}
		scrollbar thumb[vertical]:hover, scrollbar thumb[vertical]:active {
		  background-image: ${cs_thumb_hover_image_vertical} !important;
		}
		scrollbar thumb[horizontal]:hover, scrollbar thumb[horizontal]:active {
		  background-image: ${cs_thumb_hover_image_horizontal} !important;
		}
		scrollbar scrollbarbutton {
		  background-color: ${cs_buttons_color} !important;
		  border-radius: ${cs_buttons_roundness}px !important;
		  box-shadow: inset 0 0 0 ${cs_buttons_border}px ${cs_buttons_border_color} !important;
		  height: 17px !important;
		  width: 17px !important;
		}
		scrollbar[vertical] scrollbarbutton {
		  background-image: ${cs_buttons_image_vertical} !important;
		}
		scrollbar[horizontal] scrollbarbutton {
		  background-image: ${cs_buttons_image_horizontal} !important;
		}
		scrollbar scrollbarbutton:hover {
		  background-color: ${cs_buttons_hover_color} !important;
		}
		scrollbar[vertical] scrollbarbutton:hover {
		  background-image: ${cs_buttons_hover_image_vertical} !important;
		}
		scrollbar[horizontal] scrollbarbutton:hover {
		  background-image: ${cs_buttons_hover_image_horizontal} !important;
		}
	`;
	
  if(custom_scrollbar_arrows === true && custom_scrollbar_arrows_version === 1)
	custom_scrollbar_arrows_code=`
		scrollbar scrollbarbutton {
		  background-repeat: no-repeat !important;
		  background-position: center center !important;
		}
		scrollbar[vertical] scrollbarbutton[type="decrement"] {
		  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='${custom_scrollbar_arrows_color}' %3E%3Cpath d='m7.247 4.86-4.796 5.481c-.566.647-.106 1.659.753 1.659h9.592a1 1 0 0 0 .753-1.659l-4.796-5.48a1 1 0 0 0-1.506 0z'/%3E%3C/svg%3E ") !important;
		}
		scrollbar[vertical] scrollbarbutton[type="increment"] {
		  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='${custom_scrollbar_arrows_color}' %3E%3Cpath d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3E%3C/svg%3E ") !important;
		}
		scrollbar[horizontal] scrollbarbutton[type="decrement"] {
		  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='${custom_scrollbar_arrows_color}' %3E%3Cpath d='m3.86 8.753 5.482 4.796c.646.566 1.658.106 1.658-.753V3.204a1 1 0 0 0-1.659-.753l-5.48 4.796a1 1 0 0 0 0 1.506z'/%3E%3C/svg%3E ") !important;
		}
		scrollbar[horizontal] scrollbarbutton[type="increment"] {
		  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='${custom_scrollbar_arrows_color}' %3E%3Cpath d='m12.14 8.753-5.482 4.796c-.646.566-1.658.106-1.658-.753V3.204a1 1 0 0 1 1.659-.753l5.48 4.796a1 1 0 0 1 0 1.506z'/%3E%3C/svg%3E ") !important;
		}
		
        scrollbar[vertical] > scrollbarbutton[type="decrement"]:hover {
          background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='`+custom_scrollbar_arrows_hover_color+`' %3E%3Cpath d='m7.247 4.86-4.796 5.481c-.566.647-.106 1.659.753 1.659h9.592a1 1 0 0 0 .753-1.659l-4.796-5.48a1 1 0 0 0-1.506 0z'/%3E%3C/svg%3E ") !important;
          background-repeat: no-repeat !important;
          background-position: top !important;
        }

        scrollbar[vertical] > scrollbarbutton[type="increment"]:hover {
          background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='`+custom_scrollbar_arrows_hover_color+`' %3E%3Cpath d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3E%3C/svg%3E ") !important;
          background-repeat: no-repeat !important;
          background-position: bottom !important;
        }

        scrollbar[horizontal] > scrollbarbutton[type="decrement"]:hover {
          background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='`+custom_scrollbar_arrows_hover_color+`' %3E%3Cpath d='m3.86 8.753 5.482 4.796c.646.566 1.658.106 1.658-.753V3.204a1 1 0 0 0-1.659-.753l-5.48 4.796a1 1 0 0 0 0 1.506z'/%3E%3C/svg%3E ") !important;
          background-repeat: no-repeat !important;
          background-position: left !important;
        }

        scrollbar[horizontal] > scrollbarbutton[type="increment"]:hover {
          background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='`+custom_scrollbar_arrows_hover_color+`' %3E%3Cpath d='m12.14 8.753-5.482 4.796c-.646.566-1.658.106-1.658-.753V3.204a1 1 0 0 1 1.659-.753l5.48 4.796a1 1 0 0 1 0 1.506z'/%3E%3C/svg%3E ") !important;
          background-repeat: no-repeat !important;
          background-position: right !important;
        }

	`;
  else if(custom_scrollbar_arrows === true && custom_scrollbar_arrows_version === 2)
	custom_scrollbar_arrows_code=`
		scrollbar scrollbarbutton {
		  background-repeat: no-repeat !important;
		  background-position: center center !important;
		}
		scrollbar[vertical] > scrollbarbutton[type="decrement"] {
		  background-image: url("${ProfileDirectory}/Chevron-up_hellgrau.svg") !important;
		}
		scrollbar[vertical] > scrollbarbutton[type="increment"] {
		  background-image: url("${ProfileDirectory}/Chevron-down_hellgrau.svg") !important;
		}
		scrollbar[horizontal] > scrollbarbutton[type="decrement"] {
		  background-image: url("${ProfileDirectory}/Chevron-left_hellgrau.svg") !important;
		}
		scrollbar[horizontal] > scrollbarbutton[type="increment"] {
		  background-image: url("${ProfileDirectory}/Chevron-right_hellgrau.svg") !important;
		}

		/* Hover */

		scrollbar[vertical] > scrollbarbutton[type="decrement"]:hover {
		  background-image: url("${ProfileDirectory}/Chevron-up_orange.svg") !important;
		}
		scrollbar[vertical] > scrollbarbutton[type="increment"]:hover {
		  background-image: url("${ProfileDirectory}/Chevron-down_orange.svg") !important;
		}
		scrollbar[horizontal] > scrollbarbutton[type="decrement"]:hover {
		  background-image: url("${ProfileDirectory}/Chevron-left_orange.svg") !important;
		}
		scrollbar[horizontal] > scrollbarbutton[type="increment"]:hover {
		  background-image: url("${ProfileDirectory}/Chevron-right_orange.svg") !important;
		}
		  
		scrollbar[vertical] > scrollbarbutton {
			height: ${(custom_scrollbar_size_value*cs_arrows_on_buttons_buttons_size)}px !important;
			max-width: ${custom_scrollbar_size_value}px !important;
		}
		scrollbar[horizontal] > scrollbarbutton {
			width: ${(custom_scrollbar_size_value*cs_arrows_on_buttons_buttons_size)}px !important;
			max-height: ${custom_scrollbar_size_value}px !important;
		}
	`;

  if(hide_scrollbar_buttons === true)
	hide_scrollbar_buttons_code=`
		scrollbar scrollbarbutton {
		  opacity: 0 !important;
		}
		scrollbar[vertical] scrollbarbutton {
		  min-height: 1px !important;
		  height: 1px !important;
		  max-height: 1px !important;
		}
		scrollbar[horizontal] scrollbarbutton {
		  min-width: 1px !important;
		  width: 1px !important;
		  max-width: 1px !important;
		}
	`;
	
  if(custom_scrollbar_opacity === true)
	custom_scrollbar_opacity_code=`
		scrollbar {
		  opacity: ${custom_opacity_value} !important;
		}
	`;
  
  if(hide_scrollbars === true)
	hide_scrollbars_code=`
		scrollbar, scrollcorner {
		  display: none !important;
		  visibility: collapse !important;
		}
	`;
  
  if(thin_scrollbars === true)
	thin_scrollbars_code=`
		:root{
		  scrollbar-width: thin !important;
		}
		scrollbar[vertical] scrollbarbutton {
		  height: 14px !important;
		  width: 7px !important;
		}
		scrollbar[horizontal] scrollbarbutton {
		  height: 7px !important;
		  width: 14px !important;
		}
	`;

  Components.classes["@mozilla.org/content/style-sheet-service;1"]
    .getService(Components.interfaces.nsIStyleSheetService)
	  .loadAndRegisterSheet(Services.io.newURI("data:text/css;charset=utf-8," + encodeURIComponent(`
		${custom_scrollbars_code}
		${custom_scrollbar_arrows_code}
		${hide_scrollbar_buttons_code}
		${custom_scrollbar_opacity_code}
		${hide_scrollbars_code}
		${thin_scrollbars_code}
  `), null, null),
  Components.classes["@mozilla.org/content/style-sheet-service;1"]
    .getService(Components.interfaces.nsIStyleSheetService).AGENT_SHEET);

})();

Alles anzeigen

Chevron.zip

Mira_Belle

So und hier mein TEST!
In beiden Fällen das gleiche Skript.
Der einzige Unterschied, die Verwendung unterschiedlicher "Symbole", der besseren Unterscheidung wegen.

Vordere Scrollbar von FF 142, hintere von FF 144.
Wie man erkennen kann, wird der Farbverlauf des Scrollbarhintergunds [scrollbar background_color] umgesetzt.
Jedoch leider nicht der des "Schiebers" [thumb/slider]!

Was man auf dem Screenshot jetzt nicht sehen kann, die Pfeile für die horizontale Scrollbar werden
in der Version 144 nicht eingeblendet.
Auch wird der Farbverlauf so gar nicht umgesetzt, weder beim Hintergrund, noch beim "Schieber" [thumb/slider].

PS: Test ist mit dem Skript aus #14, wobei für die Version 144 die Anpassungen gemacht werden mussten.

Mira_Belle

Zitat von Sören Hentzschel

lennys Aussage war, man müsse das CSS eventuell als Agent Sheet importieren. Deine Antwort war, dass das nicht notwendig sei und es auch ohne das ginge. Darauf zeigte ich dir, dass du genau das in deinem Script bereits tust. Das Script in Beitrag #14 übrigens ebenso.

Wissen macht AH!

Danke.

Mira_Belle

Zitat von Sören Hentzschel

Ob das wirklich einen Unterschied macht, weiß ich nicht. Aber was „geht auch so“ betrifft: Du fügst das CSS in deinem Script ja bereits als Agent Sheet ein, siehe Zeile 340 im Script aus Beitrag #32.

Sorry, da stehe ich jetzt wirklich auf'em Schlauch!

Ich hatte nur festgestellt, dass das eine Skript (aus Beitrag #14), mit den "Änderungen an den Selektoren", teilweise
den Farbverlauf umsetzt, und "mein" Skript eben nicht.

Da ich noch der Wurm drin!

Mira_Belle

Zitat von grisu2099

Hab ich. Ergebnis: Bei einer horizontalen Scrollleiste erscheinen keine Pfeile...

Danke für die Fehlermeldung.
Da brauche ich noch gar nicht lange rummachen, liegt nicht am Skript.
Denn auch beim Original, mit den Änderungen, siehe unten, funktioniert es nicht!

Zitat von lenny2

Ich habe einmal gelesen, dass man dafür die Scrollbar-CSS mit den Rechten „Agent Sheet” aktivieren muss

Nein, das geht auch so! Der Fehler steckt im Skript!
Denn mit der Version von Endor, mit den Änderungen " [orient="xxx"] zu [xxx] " funktioniert der Farbverlauf ja zum Teil.

Mira_Belle

Hier nun mein überarbeitetes Skript!
Auch wenn ich den Code von den Symbolen eigentlich nicht ins Skript schreiben wollte,
musste ich es dennoch machen, weil ... , wegen des internen Codes.

Habe weitere Parameter aus dem originalen Skript eingebaut, und so lässt sich nun
die Scrollleiste z.B. auch schmal machen.

Probiert es aus und wenn etwas unklar ist, fragen!

Eine weniger schöne Sache muss ich aber noch erwähnen!

Der Farbverlauf funktioniert ab Firefox 143 nicht mehr. Warum? Ich weiß es nicht.
Bleibe aber dran

JavaScript

// Scrollbar.uc.js

"use strict";
/* Firefox userChrome.js tweaks - 'Custom Scrollbars' for Firefox ************************************************************ */
/* Original by Aris (aris-addons@gmx.net)************************************************************************************* */
/* Github: https://github.com/Aris-t2/CustomJSforFx/blob/master/scripts/custom_scrollbars.uc.js
/* *************************************************************************************************************************** */
/* Customized by Mira********************************************************************************************************* */
/* https://www.camp-firefox.de/forum/thema/135133-custom-scrollbars-uc-js-anpassen/ ****************************************** */
/* Scrollbar.v1.0.6.js    https://www.camp-firefox.de/forum/thema/135133/?postID=1207718#post1207718************************** */
/* https://www.camp-firefox.de/forum/thema/136152/?postID=1222989#post1222989************************************************* */
/* Scrollbar.v2.0.2.js    https://www.camp-firefox.de/forum/thema/136167/?postID=1223096#post1223096************************** */
/* Scrollbar.v2.0.3.js    https://www.camp-firefox.de/forum/thema/136167/?postID=1223124#post1223124************************** */
/* Scrollbar.v2.0.5.js    https://www.camp-firefox.de/forum/thema/136167/?postID=1223143#post1223143************************** */
/* Scrollbar.v2.0.6.1.js  https://www.camp-firefox.de/forum/thema/136167/?postID=1223162#post1223162************************** */
/* *************************************************************************************************************************** */
/* Custom Scrollbars for Firefox ********************************************************************************************* */
/* Version: 2.0.7 RC2 for Firefox 143+ *************************************************************************************** */
/* ******************************************************************************************************************************

README

  about:config >
    widget.windows.overlay-scrollbars.enabled > false (Windows)
    widget.gtk.overlay-scrollbars.enabled > false (Linux)
  [!] The above preferences have to be set to 'false' for this code to work
 
  [!] DER STARTUP-CACHE MUSS NACH JEDER ÄNDERUNG GELÖSCHT WERDEN!
  -> Ordner 'startupCache' finden: Adressleiste > about:profiles > Lokales Verzeichnis > Ordner öffnen > startupCache
  -> Firefox schließen
  -> Inhalt des 'startupCache'-Ordners löschen

  Alternativ mit einem JavaScipt!
  -> https://github.com/Endor8/userChrome.js/blob/master/Firefox%2087/RestartFirefoxButtonM.uc.js
 
  Anpassungen vornehmen > Werte ändern
  - Optionen aktivieren/deaktivieren: true <-> false
  - Farbe
    - Name: red, blue, transparent 
    - Hexcode: #33CCFF, #FFF
    - rgb(a): rgba(0,0,255,0.8)
    - hsl(a): hsla(240,100%,50%,0.8)
  - Zahlen: 1, 2, 3 ... 10, 11, 12 ...
  - Deckkraft (in Dezimalzahlen): 0.0 bis 1.0 z.B. 1.4 oder 1.75
  - Farbverläufe: linear-gradient(direction, color, color, color)
  - Beispiel für Farbverläufe: linear-gradient(to right, blue, #33CCFF, rgba(0,0,255,0.8))
  - vordefinierte Farbverläufe: transparent,rgba(255,255,255,0.5),transparent -> transparent,rgba(255,255,255,0.0),transparent
  - keine Farbe oder keine Farbwerte -> verwende "unset"
*/
/* *************************************************************************************************************************** */
(function() {

  // PROFILE PHATH "CALCULATE"
  let ProfileDirectory = PathUtils.toFileURI(PathUtils.join(PathUtils.profileDir, 'chrome', 'icons'));
  // GENERAL SCROLLBAR SETTINGS
  const custom_scrollbar_size_value = 17;               // in px // default: custom_scrollbar_size_value = 17
  // CUSTOM SCROLLBAR SETTINGS ("custom_scrollbar_" --> "cs_")
  const custom_scrollbars = true;                       // default: custom_scrollbars = true
  const custom_scrollbar_arrows = true;                 // default: custom_scrollbar_arrows = true
  const custom_scrollbar_arrows_version = 1;            // default: custom_scrollbar_arrows_version = 1
                                                        //  1 ==> SVG arrows as code: might not work on some pages
                                                        //  2 ==> SVG arrows as files: placed inside 'chrome\icons' folder

  // only for 'custom_scrollbar_arrows_version = 1'
  const custom_scrollbar_arrows_color = "%23bfbfbf";     // default: custom_scrollbar_arrows_color = "grey"; / # ==> %23 e.g. #33CCFF ==> %2333CCFF
  const custom_scrollbar_arrows_hover_color = "%23ffae00";   // default: custom_scrollbar_arrows_hover_color = "orange"; # ==> %23

  const cs_thumb_border = 1;                            // default: cs_thumb_border = 0 / in px 1
  const cs_thumb_roundness = 9;                         // default: cs_thumb_roundness = 0 / in px 9
  const cs_buttons_border = 0;                          // default: cs_buttons_border = 0 / in px
  const cs_buttons_roundness = 0;                       // default: cs_buttons_roundness = 0 / in px
  const cs_thumb_minimal_size = 12;                     // default: cs_thumb_minimal_size = 12; / in px
  const cs_ignore_color_gradients = true;               // default: cs_ignore_color_gradients = false / 'flat' scrollbars
// CUSTOM SCROLLBAR COLORS/GRADIENTS
// - background
  const cs_background_color = "#5b5b66";              // default: cs_background_color = "#DDDDDD"
  let cs_background_image_vertical = "linear-gradient(to right,transparent,rgba(255,0,0,0.5),transparent)";           // default: cs_background_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)"
  let cs_background_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,0,0,0.5),transparent)";         // default: cs_background_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)"
  let cs_arrows_on_buttons_buttons_size = 1.0;          // default: cs_arrows_on_buttons_buttons_size = 1.0
  let cs_background_roundness = 0;                      // default: cs_background_roundness = 0 / in px
// - corner
  const cs_corner_background_color = "#bfbfbf";       // default: cs_corner_background_color = "#DDDDDD" / - corner
  let cs_corner_background_image = "linear-gradient(45deg,transparent 30%,rgba(255,255,255,0.5) 50%,transparent 70%),linear-gradient(-45deg,transparent 30%,rgba(255,255,255,0.5) 50%,transparent 70%)";             // default: cs_corner_background_image = "linear-gradient(45deg,transparent 30%,rgba(255,255,255,0.5) 50%,transparent 70%),linear-gradient(-45deg,transparent 30%,rgba(255,255,255,0.5) 50%,transparent 70%)"
// - thumb/slider
  const cs_thumb_color = "#bfbfbf";                   // default: cs_thumb_color = "#33CCFF" / thumb/slider
  let cs_thumb_image_vertical = "linear-gradient(to right,transparent,rgba(255,0,255,0.5),transparent)";                // default: cs_thumb_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)"
  let cs_thumb_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,0,255,0.5),transparent)";              // default: cs_thumb_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)"
  const cs_thumb_hover_color = "#ffae00";            // default: cs_thumb_hover_color = "#66FFFF"
  let cs_thumb_hover_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)";          // default: cs_thumb_hover_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)"
  let cs_thumb_hover_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)";        // default: cs_thumb_hover_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)"
  const cs_thumb_border_color = "#5b5b66";            // default: cs_thumb_border_color = "#33CCFF"
// - buttons
  const cs_buttons_color = "#5b5b66";                 // default: cs_buttons_color = "#66FFFF" "#5b5b66"/ buttons
  let cs_buttons_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)";              // default: cs_buttons_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)"
  let cs_buttons_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)";            // default: cs_buttons_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)"
  const cs_buttons_hover_color = "#5b5b66";           // default: cs_buttons_hover_color = "#33CCFF"
  const cs_buttons_border_color = "#5b5b66";          // default: cs_buttons_border_color = "#33CCFF" "#5b5b66"
  let cs_buttons_hover_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)";        // default: cs_buttons_hover_image_vertical = "linear-gradient(to right,transparent,rgba(255,255,255,0.5),transparent)"
  let cs_buttons_hover_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)";      // default: cs_buttons_hover_image_horizontal = "linear-gradient(to bottom,transparent,rgba(255,255,255,0.5),transparent)"

  const hide_scrollbars = false;                // default: hide_scrollbars = false
  const hide_scrollbar_buttons = false;         // default: hide_scrollbar_buttons = false
  const thin_scrollbars = false;                // default: thin_scrollbars = false / browsers own way to show thin scrollbars
  const custom_scrollbar_opacity = true;        // default: custom_scrollbar_opacity = false
  const custom_opacity_value = "1.0";           // default: custom_opacity_value = "1.0"

/* *************************************************************************************************************************** */
  // unset background image color gradients -> flat scrollbars
  if(cs_ignore_color_gradients === true)
    cs_background_image_vertical
    = cs_background_image_horizontal
    = cs_corner_background_image
    = cs_thumb_image_vertical
    = cs_thumb_image_horizontal
    = cs_thumb_hover_image_vertical
    = cs_thumb_hover_image_horizontal
    = cs_buttons_image_vertical
    = cs_buttons_image_horizontal
    = cs_buttons_hover_image_vertical
    = cs_buttons_hover_image_horizontal
    = "unset";

  let custom_scrollbars_code='';
  let custom_scrollbar_arrows_code='';
  let hide_scrollbar_buttons_code='';
  let custom_scrollbar_opacity_code='';
  let hide_scrollbars_code='';
  let thin_scrollbars_code='';

  if(custom_scrollbars === true)
	custom_scrollbars_code=`
		slider, scrollcorner, scrollbar thumb, scrollbar scrollbarbutton {
		  appearance: auto;
		  -moz-default-appearance: none !important;
		}
		slider {
		  background-color: ${cs_background_color} !important;
		}
		scrollbar[vertical] slider {
		  background-image: ${cs_background_image_vertical} !important;
		  border-radius: ${cs_background_roundness}px !important;
		}
		scrollbar[horizontal] slider {
		  background-image: ${cs_background_image_horizontal} !important;
		  border-radius: ${cs_background_roundness}px !important;
		}
		scrollcorner {
		  background-color: ${cs_corner_background_color} !important;
		  background-image: ${cs_corner_background_image} !important;
		}
		scrollbar thumb {
		  background-color: ${cs_thumb_color} !important;
		  border-radius: ${cs_thumb_roundness}px !important;
		  box-shadow: inset 0 0 0 ${cs_thumb_border}px ${cs_thumb_border_color} !important;
		}
		scrollbar thumb[vertical] {
		  background-image: ${cs_thumb_image_vertical} !important;
		  min-height: ${(cs_thumb_minimal_size+cs_thumb_roundness+cs_thumb_border)}px !important;
		}
		scrollbar thumb[horizontal] {
		  background-image: ${cs_thumb_image_horizontal} !important;
		  min-width: ${(cs_thumb_minimal_size+cs_thumb_roundness+cs_thumb_border)}px !important;
		}
		scrollbar thumb:hover, scrollbar thumb:active {
		  background-color: ${cs_thumb_hover_color} !important;
		}
		scrollbar thumb[vertical]:hover, scrollbar thumb[vertical]:active {
		  background-image: ${cs_thumb_hover_image_vertical} !important;
		}
		scrollbar thumb[horizontal]:hover, scrollbar thumb[horizontal]:active {
		  background-image: ${cs_thumb_hover_image_horizontal} !important;
		}
		scrollbar scrollbarbutton {
		  background-color: ${cs_buttons_color} !important;
		  border-radius: ${cs_buttons_roundness}px !important;
		  box-shadow: inset 0 0 0 ${cs_buttons_border}px ${cs_buttons_border_color} !important;
		  height: 17px !important;
		  width: 17px !important;
		}
		scrollbar[vertical] scrollbarbutton {
		  background-image: ${cs_buttons_image_vertical} !important;
		}
		scrollbar[horizontal] scrollbarbutton {
		  background-image: ${cs_buttons_image_horizontal} !important;
		}
		scrollbar scrollbarbutton:hover {
		  background-image: ${cs_buttons_hover_color} !important;
		}
		scrollbar[vertical] scrollbarbutton:hover {
		  background-image: ${cs_buttons_hover_image_vertical} !important;
		}
		scrollbar[horizontal] scrollbarbutton:hover {
		  background-image: ${cs_buttons_hover_image_horizontal} !important;
		}
	`;
	
  if(custom_scrollbar_arrows === true && custom_scrollbar_arrows_version === 1)
	custom_scrollbar_arrows_code=`
		scrollbar scrollbarbutton {
		  background-repeat: no-repeat !important;
		  background-position: center center !important;
		}
    /* arrow-up */  
		scrollbar[vertical] > scrollbarbutton[type="decrement"] {
		  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='${custom_scrollbar_arrows_color}' %3E%3Cpath d='m8.352 5.001 5.466 5.465a.623.623 0 0 1-.001.884.628.628 0 0 1-.885 0L7.999 6.416l-4.932 4.933a.626.626 0 0 1-.885-.885L7.648 5l.704.001z'/%3E%3C/svg%3E ") !important;
		}
    /* arrow-down */
		scrollbar[vertical] > scrollbarbutton[type="increment"] {
		  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='${custom_scrollbar_arrows_color}' %3E%3Cpath d='m8.352 10.999 5.466-5.465a.623.623 0 0 0-.001-.884.628.628 0 0 0-.885 0L7.998 9.585l-4.93-4.934a.626.626 0 0 0-.885.885L7.648 11l.704-.001z'/%3E%3C/svg%3E ") !important;
		}
    /* arrow-left */
		scrollbar[horizontal] > scrollbarbutton[type="decrement"] {
		  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='${custom_scrollbar_arrows_color}' %3E%3Cpath d='m5.001 8.352 5.465 5.466a.626.626 0 0 0 .884-.886L6.416 7.999l4.933-4.932a.626.626 0 0 0-.885-.885L5 7.647l.001.705z'/%3E%3C/svg%3E ") !important;
		}
    /* arrow-right */
		scrollbar[horizontal] > scrollbarbutton[type="increment"] {
		  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='${custom_scrollbar_arrows_color}' %3E%3Cpath d='m10.999 8.352-5.465 5.466a.626.626 0 0 1-.884-.886l4.935-4.934-4.934-4.931a.626.626 0 0 1 .885-.885L11 7.647l-.001.705z'/%3E%3C/svg%3E ") !important;
		}
    /* arrow-up */ 
		scrollbar[vertical] > scrollbarbutton[type="decrement"]:hover {
		  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='${custom_scrollbar_arrows_hover_color}' %3E%3Cpath d='m8.352 5.001 5.466 5.465a.623.623 0 0 1-.001.884.628.628 0 0 1-.885 0L7.999 6.416l-4.932 4.933a.626.626 0 0 1-.885-.885L7.648 5l.704.001z'/%3E%3C/svg%3E ") !important;
		}
    /* arrow-down */  
		scrollbar[vertical] > scrollbarbutton[type="increment"]:hover {
		  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='${custom_scrollbar_arrows_hover_color}' %3E%3Cpath d='m8.352 10.999 5.466-5.465a.623.623 0 0 0-.001-.884.628.628 0 0 0-.885 0L7.998 9.585l-4.93-4.934a.626.626 0 0 0-.885.885L7.648 11l.704-.001z'/%3E%3C/svg%3E ") !important;
		}
    /* arrow-left */
		scrollbar[horizontal] > scrollbarbutton[type="decrement"]:hover {
		  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='${custom_scrollbar_arrows_hover_color}' %3E%3Cpath d='m5.001 8.352 5.465 5.466a.626.626 0 0 0 .884-.886L6.416 7.999l4.933-4.932a.626.626 0 0 0-.885-.885L5 7.647l.001.705z'/%3E%3C/svg%3E ") !important;
		}
    /* arrow-right */
		scrollbar[horizontal] > scrollbarbutton[type="increment"]:hover {
		  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='${custom_scrollbar_arrows_hover_color}' %3E%3Cpath d='m10.999 8.352-5.465 5.466a.626.626 0 0 1-.884-.886l4.935-4.934-4.934-4.931a.626.626 0 0 1 .885-.885L11 7.647l-.001.705z'/%3E%3C/svg%3E ") !important;
		}
	`;

  else if(custom_scrollbar_arrows === true && custom_scrollbar_arrows_version === 2)
	custom_scrollbar_arrows_code=`
		scrollbar scrollbarbutton {
		  background-repeat: no-repeat !important;
		  background-position: center center !important;
		}
		scrollbar[vertical] > scrollbarbutton[type="decrement"] {
		  background-image: url("${ProfileDirectory}/Pfeil-hoch_hellgrau.svg") !important;
		}
		scrollbar[vertical] > scrollbarbutton[type="increment"] {
		  background-image: url("${ProfileDirectory}/Pfeil-runter_hellgrau.svg") !important;
		}
		scrollbar[horizontal] > scrollbarbutton[type="decrement"] {
		  background-image: url("${ProfileDirectory}/Pfeil-links_hellgrau.svg") !important;
		}
		scrollbar[horizontal] > scrollbarbutton[type="increment"] {
		  background-image: url("${ProfileDirectory}/Pfeil-rechts_hellgrau.svg") !important;
		}

    /* hover */

    scrollbar[vertical] > scrollbarbutton[type="decrement"]:hover {
      background-image: url("${ProfileDirectory}/Pfeil-hoch_orange.svg") !important;
    }
    scrollbar[vertical] > scrollbarbutton[type="increment"]:hover {
      background-image: url("${ProfileDirectory}/Pfeil-runter_orange.svg") !important; */
    }
    scrollbar[horizontal] > scrollbarbutton[type="decrement"]:hover {
      background-image: url("${ProfileDirectory}/Pfeil-links_orange.svg") !important;
    }
    scrollbar[horizontal] > scrollbarbutton[type="increment"]:hover {
      background-image: url("${ProfileDirectory}/Pfeil-rechts_orange.svg") !important;
    }

    scrollbar[vertical] > scrollbarbutton {
      height: ${(custom_scrollbar_size_value*cs_arrows_on_buttons_buttons_size)}px !important;
      max-width: ${custom_scrollbar_size_value}px !important;
    }
    scrollbar[horizontal] > scrollbarbutton {
      width: ${(custom_scrollbar_size_value*cs_arrows_on_buttons_buttons_size)}px !important;
      max-height: ${custom_scrollbar_size_value}px !important;
    }
	`;

  if(hide_scrollbar_buttons === true)
	hide_scrollbar_buttons_code=`
		scrollbar scrollbarbutton {
		  opacity: 0 !important;
		}
		scrollbar[vertical] scrollbarbutton {
		  min-height: 1px !important;
		  height: 1px !important;
		  max-height: 1px !important;
		}
		scrollbar[horizontal] scrollbarbutton {
		  min-width: 1px !important;
		  width: 1px !important;
		  max-width: 1px !important;
		}
	`;
	
  if(custom_scrollbar_opacity === true)
	custom_scrollbar_opacity_code=`
		scrollbar {
		  opacity: ${custom_opacity_value} !important;
		}
	`;
  
  if(hide_scrollbars === true)
	hide_scrollbars_code=`
		scrollbar, scrollcorner {
		  display: none !important;
		  visibility: collapse !important;
		}
	`;
  
  if(thin_scrollbars === true)
	thin_scrollbars_code=`
		:root{
		  scrollbar-width: thin !important;
		}
		scrollbar[vertical] scrollbarbutton {
		  height: 14px !important;
		  width: 7px !important;
		}
		scrollbar[horizontal] scrollbarbutton {
		  height: 7px !important;
		  width: 14px !important;
		}
	`;

  Components.classes["@mozilla.org/content/style-sheet-service;1"]
    .getService(Components.interfaces.nsIStyleSheetService)
      .loadAndRegisterSheet(Services.io.newURI("data:text/css;charset=utf-8," + encodeURIComponent(`
        ${custom_scrollbars_code}
        ${custom_scrollbar_arrows_code}
        ${hide_scrollbar_buttons_code}
        ${custom_scrollbar_opacity_code}
        ${hide_scrollbars_code}
        ${thin_scrollbars_code}
    `), null, null),

  Components.classes["@mozilla.org/content/style-sheet-service;1"]
    .getService(Components.interfaces.nsIStyleSheetService).AGENT_SHEET);

})()

Alles anzeigen

Mira_Belle

lenny2 Bitte die Konfiguration, die Du im Skript von Aris verwendet hast

Beiträge von Mira_Belle

Skript zum Anpassen der Scrollbar funktioniert nicht mehr richtig

Skript zum Anpassen der Scrollbar funktioniert nicht mehr richtig

Skript zum Anpassen der Scrollbar funktioniert nicht mehr richtig

Skript zum Anpassen der Scrollbar funktioniert nicht mehr richtig

Skript zum Anpassen der Scrollbar funktioniert nicht mehr richtig

Skript zum Anpassen der Scrollbar funktioniert nicht mehr richtig

Skript zum Anpassen der Scrollbar funktioniert nicht mehr richtig

Skript zum Anpassen der Scrollbar funktioniert nicht mehr richtig

Skript zum Anpassen der Scrollbar funktioniert nicht mehr richtig

Skript zum Anpassen der Scrollbar funktioniert nicht mehr richtig

userChrome.js Scripte für den Fuchs (Diskussion)

Skript zum Anpassen der Scrollbar funktioniert nicht mehr richtig

userChrome.js Scripte für den Fuchs (Diskussion)

Skript zum Anpassen der Scrollbar funktioniert nicht mehr richtig

Skript zum Anpassen der Scrollbar funktioniert nicht mehr richtig

Skript zum Anpassen der Scrollbar funktioniert nicht mehr richtig

Skript zum Anpassen der Scrollbar funktioniert nicht mehr richtig

Skript zum Anpassen der Scrollbar funktioniert nicht mehr richtig

Skript zum Anpassen der Scrollbar funktioniert nicht mehr richtig

Skript zum Anpassen der Scrollbar funktioniert nicht mehr richtig