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. 
Beiträge von Mira_Belle
-
-
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.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. -
2002Andreas Danke. Mir scheint, es funktioniert jetzt wieder alles.
-
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?
-
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
Alles anzeigen// 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); })();Noch jemand da?
ArisCTR
Kann jemand bitte das Skript testen? -
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.
-
2002Andreas Komisch.
Hast Du das CSS und das JS einfach so genommen, oder irgendetwas verändert? -
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!
/* 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. -
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.
-
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? -
2002Andreas Danke.
Also schon ab der 143 das gleiche Problem. -
In der Nightly 144 funktioniert dieses Skript nicht mehr!
JavaScript
Alles anzeigen// 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);Kann das jemand bestätigen und kann das jemand auch in der 143 überprüfen?
Danke -
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
Alles anzeigen// 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); })(); -
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.
-
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.
-
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!
-
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!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. -
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 dranJavaScript
Alles anzeigen// 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); })() -
lenny2 Bitte die Konfiguration, die Du im Skript von Aris verwendet hast
-
Interessant.
Sei so lieb und poste mal die Skripteinstellungen.
