Ich werd' Verrückt!
Ich habs!!!!!!
Es ist vollbracht.
Ich muss den Code noch ins Reine bringen, dann werde ich ihn noch nachreichen
Ich werd' Verrückt!
Ich habs!!!!!!
Es ist vollbracht.
Ich muss den Code noch ins Reine bringen, dann werde ich ihn noch nachreichen
Das fertige JavaScript
"use strict";
/* Firefox 57+ userChrome.js tweaks - SCROLLBARS ********************************************** */
/* Original by Aris (aris-addons@gmx.net)****************************************************** */
/* Github: https://github.com/aris-t2/customscrollbarsforfx *********************************** */
/* ******************************************************************************************** */
/* Customized by Mira************************************************************************** */
/* https://www.camp-firefox.de/forum/thema/135133-custom-scrollbars-uc-js-anpassen/ *********** */
/* ******************************************************************************************** */
/* Custom Scrollbars for Firefox ************************************************************** */
/* version 1.0.6 ****************************************************************************** */
/* ******************************************************************************************** */
/* ***********************************************************************************************
README
!!! Wichtig !!!
Die Einstellungen müssen auf 'false' gesetzt werden, damit dies auf aktuellen Firefox-Builds (102+) funktioniert
about:config >
widget.windows.overlay-scrollbars.enabled > false (Windows)
widget.gtk.overlay-scrollbars.enabled > false (Linux/MacOSX)
[!] 'Methode 2' ist erforderlich, um Firefox für benutzerdefinierte JavaScript-Dateien vorzubereiten
[!] Die Datei 'custom_scrollbars.uc.js' gehört in den Firefox-Profilordner 'chrome'!
-> Profilordner finden: Adressleiste > about:profiles > Wurzelordner > Ordner öffnen
-> Datei zum Ordner \chrome\ hinzufügen (ggf. einen Ordner mit Namen "chrome" erstellen)
[!] 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
Aktivieren einer Einstellung > var ... auf 'true' setzen
Deaktivieren einer Einstellung > var ... auf 'false' setzen
Anpassungen vornehmen > Werte ändern
- Farbe - Name: red, blue, transparent / Hexcode: #33CCFF, #FFF
- Farbe - rgb(a): rgba(0,0,255,0.8) / hsl(a): hsla(240,100%,50%,0.8) // a = Sichtbarkeit (transparenz)
- Zahlen: 1, 2, 3 ... 10, 11, 12 ...
- Deckkraft (in Dezimalzahlen): 0.0 bis 1.0 z.B. 1.4, 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))
HINWEIS
- Zu kleine Werte für die Scrollbar-Breite werden sich negativ auf einige Oberflaechenelemente auswirken!
*********************************************************************************************** */
// GENERAL SCROLLBAR SETTINGS
var custom_scrollbar_size_value = 16; // in px // default: custom_scrollbar_size_value = 17
var custom_opacity_value = "1.0"; // default: custom_opacity_value = "1.0"
// CUSTOM SCROLLBAR SETTINGS ("custom_scrollbar_" --> "cs_")
var cs_thumb_border = 1; // in px // default: cs_thumb_border = 0 // Rahmen des Sliders
var cs_thumb_roundness = 15; // in px // default: cs_thumb_roundness = 0 // Rundung des Sliders
var cs_thumb_minimal_size = 12; // in px
// CUSTOM SCROLLBAR COLORS/GRADIENTS
// - background
var cs_background_color = "#5b5b66"; // default: cs_background_color = "#DDDDDD"
var cs_background_image_vertical = "unset"; // default: cs_background_image_vertical = "unset"
var cs_background_image_horizontal = "unset"; // default: cs_background_image_horizontal = "unset"
// - corner
var cs_corner_background_color = "red"; // default: cs_corner_background_color = "#DDDDDD"
var cs_corner_background_image = "unset"; // default: cs_corner_background_image = "unset"
// - thumb/slider
var cs_thumb_color = "#bfbfbf"; // default: cs_thumb_color = "#33CCFF"
var cs_thumb_image_vertical = "unset"; // default: cs_thumb_image_vertical = "unset"
var cs_thumb_image_horizontal = "unset"; // default: cs_thumb_image_horizontal = "unset"
var cs_thumb_hover_color = "orange"; // default: cs_thumb_hover_color = "#66FFFF"
var cs_thumb_hover_image_vertical = "unset"; // default: cs_thumb_hover_image_vertical = "unset"
var cs_thumb_hover_image_horizontal = "unset"; // default: cs_thumb_hover_image_horizontal = "unset"
var cs_thumb_border_color = "#5b5b66"; // default: cs_thumb_border_color = "#33CCFF" "#5b5b66"
// - buttons
var cs_buttons_image_vertical = "unset"; // default: cs_buttons_image_vertical = "unset"
var cs_buttons_image_horizontal = "unset"; // default: cs_buttons_image_horizontal = "unset"
var cs_buttons_hover_color = "#bfbfbf"; // default: cs_buttons_hover_color = "#33CCFF"
var cs_buttons_hover_image_vertical = "unset"; // default: cs_buttons_hover_image_vertical = "unset"
var cs_buttons_hover_image_horizontal = "unset"; // default: cs_buttons_hover_image_horizontal = "unset"
var cs_color_arrow = "#bfbfbf";
var cs_color_arrow_hover = "orange";
var cs_width = 16;
var cs_height = 16;
/* ******************************************************************************************** */
/* ******************************************************************************************** */
/* ******************************************************************************************** */
// Scrollbar code
Components.utils.import("resource://gre/modules/Services.jsm");
var ss = Components.classes["@mozilla.org/content/style-sheet-service;1"].getService(Components.interfaces.nsIStyleSheetService);
var custom_scrollbars = {
init: function() {
var uri = Services.io.newURI("data:text/css;charset=utf-8," + encodeURIComponent('\
\
@namespace html url("http://www.w3.org/1999/xhtml");\
\
scrollbar, scrollcorner, scrollbar thumb, \
scrollbar[orient="vertical"] scrollbarbutton[type="increment"], \
scrollbar[orient="vertical"] scrollbarbutton[type="decrement"], \
scrollbar[orient="horizontal"] scrollbarbutton[type="increment"], \
scrollbar[orient="horizontal"] scrollbarbutton[type="decrement"] {\
-moz-appearance: none !important;\
appearance: none !important;\
}\
scrollbar {\
background-color: '+cs_background_color+' !important;\
}\
scrollbar[orient="vertical"] {\
background-image: '+cs_background_image_vertical+' !important;\
}\
scrollbar[orient="horizontal"] {\
background-image: '+cs_background_image_horizontal+' !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;\
border: '+cs_thumb_border+'px solid '+cs_thumb_border_color+' !important;\
}\
scrollbar thumb[orient="vertical"] {\
background-image: '+cs_thumb_image_vertical+' !important;\
min-height: '+(cs_thumb_minimal_size+cs_thumb_roundness+cs_thumb_border)+'px !important;\
}\
scrollbar thumb[orient="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[orient="vertical"]:hover, scrollbar thumb[orient="vertical"]:active,\
scrollbar thumb[orient="horizontal"]:hover, scrollbar thumb[orient="horizontal"]:active {\
background-image: '+cs_thumb_hover_image_vertical+' !important;\
}\
scrollbar[orient="vertical"] scrollbarbutton[type="decrement"] {\
mask-image: url("file:///C:/Users/ ... /chrome/icons/Chevron-up,_12.svg") !important;\
}\
scrollbar[orient="vertical"] scrollbarbutton[type="increment"] {\
mask-image: url("file:///C:/Users/ ... /chrome/icons/Chevron-down,_12.svg") !important;\
}\
scrollbar[orient="horizontal"] scrollbarbutton[type="increment"] {\
mask-image: url("file:///C:/Users/ ... /chrome/icons/Chevron-right,_12.svg") !important;\
}\
scrollbar[orient="horizontal"] scrollbarbutton[type="decrement"] {\
mask-image: url("file:///C:/Users/ ... /chrome/icons/Chevron-left,_12.svg") !important;\
}\
scrollbarbutton[type="increment"],\
scrollbar[orient="vertical"] scrollbarbutton[type="decrement"],\
scrollbarbutton[type="increment"],\
scrollbar[orient="horizontal"] scrollbarbutton[type="decrement"] {\
\
mask-repeat: no-repeat;\
mask-position: center;\
background-color: '+cs_color_arrow+';\
width: '+cs_width+'px !important;\
height: '+cs_height+'px !important;\
}\
scrollbarbutton[type="increment"]:hover,\
scrollbar[orient="vertical"] scrollbarbutton[type="decrement"]:hover,\
scrollbarbutton[type="increment"]:hover,\
scrollbar[orient="horizontal"] scrollbarbutton[type="decrement"]:hover {\
background-color: '+cs_color_arrow_hover+' !important;\
}\
\
'), null, null);
ss.loadAndRegisterSheet(uri, ss.AGENT_SHEET);
}
};
// enable settings as configured above
custom_scrollbars.init();
Alles anzeigen
Kinder zu bekommen einfacher.
Hattu fein macht
Danke fürs Teilen.
Jezz habbich die Qual der Wahl , welches Layout mit welchen Funktionen mir mehr zusagt .
Frage:
(Wie) kamm man die Scrollbars breiter bzw höher machen?
Das hier:
var custom_scrollbar_size_value = 17; // in px // default: custom_scrollbar_size_value = 17
führt bei Wertänderungen zu nix, weil die Variable nirgendwo mehr auftaucht...
Antwort (30 Minuten später):
scrollbar[orient="vertical"] {\
background-image: '+cs_background_image_vertical+' !important;\
width: '+custom_scrollbar_size_value+'px !important;\
}\
scrollbar[orient="horizontal"] {\
background-image: '+cs_background_image_horizontal+' !important;\
height: '+custom_scrollbar_size_value+'px !important;\
}\
Und so bekommt man unten rechts inne Ecke was rein:
scrollcorner {\
background-color: '+cs_corner_background_color+' !important;\
background-image: url("file:///D:/01_gfx/scroller/doppelpfeil.svg") !important;\
width: '+custom_scrollbar_size_value+'px !important;\
}\
Sieht bei mir hier b.a.w. so aus:
Frage:
(Wie) kamm man die Scrollbars breiter bzw höher machen?
Das hier:
var custom_scrollbar_size_value = 17; // in px // default: custom_scrollbar_size_value = 17
führt bei Wertänderungen zu nix, weil die Variable nirgendwo mehr auftaucht...
Da war ich wohl etwas zu eifrig. Sorry.
Aber Danke für die Korrektur.
Habe den Code wieder eingepflegt.
Der eigentliche Grund ist aber, dass die normale 'userChome.css' als 'USER_SHEET' registriert und ausgeführt wird. Damit kann man aber bestimmte Elemente(z.B. Scrollbars) der Firefox-Oberfläche nicht erreichen, bzw sie werden wieder überschrieben.
Ach du Sch*, das erklärt natürlich, dass sich nicht erfolgreich war.
Würde es mit dem UserCSSLoader funktionieren? Endor, ist doch die aktuelle Version, oder?
Würde es mit dem UserCSSLoader funktionieren? Endor, ist doch die aktuelle Version, oder?
Ja, ich denke, dass sollte funktionieren. Ich benutze den UserCSSLoader nicht, aber wenn ich mir den Code und die Kommentare anschaue, dann wird dort explizit zwischen 'USER_SHEET' und 'AGENT_SHEET' unterschieden. Zum Ausführen als 'AGENT_SHEET'
muss man dann wohl die css-Datei als .as.css abspeichern. Ansonsten einfach mal ausprobieren...
Hallo Speravir.
Vom usercssloader.uc.js Script habe ich hier eine aktuellere Version,
vielleicht testet ihr die mal.
// ==UserScript==
// @name UserCSSLoader
// @description CSS Codes - Styles laden und verwalten
// @namespace http://d.hatena.ne.jp/Griever/
// @author Griever
// @include main
// @license MIT License
// @compatibility Firefox 4 - 102*
// @charset UTF-8
// @version 0.0.4K
// @note Fx92: getURLSpecFromFile() -> getURLSpecFromActualFile()
// @note AUTHOR_SHEET Verwendung hinzugefügt, wichtig: am Ende des Dateinamens .author.css
// @note Version 0.0.4.g ermoeglicht "Styles importieren" per Mittelklick und Verwendung
// @note eines anderen Dateimanager (s. vFileManager in Zeile 53)
// @note Frei verschiebbare Schaltfläche eingebaut von aborix
// @note 0.0.4 Remove E4X
// @note CSSEntry-Klasse erstellt
// @note Style-Test-Funktion überarbeitet
// @note Wenn die Datei gelöscht wurde, CSS beim Neu erstellen und Löschen des Menüs abbrechen
// @note uc einlesen .uc.css temporäre Korrespondenz zum erneuten Lesen
// ==/UserScript==
/****** Bedienungsanleitung ******
CSS-Ordner im Chrome-Ordner erstellen, CSS-Dateien dort ablegen - speichern.
Diejenigen, deren Dateiname mit "xul-" beginnen, diejenigen, die mit ".as.css" enden, sind AGENT_SHEET,
alle andere außer USER_SHEET werden gelesen. Da der Inhalt der Datei nicht überprüft wird,
darauf achten, @ Namespace Angabe nicht zu vergessen!
CSS-Menü wird zur Menüleiste hinzugefügt
Linksklick auf Stil, zum aktivieren/deaktivieren
Mittelklick auf Stil zum aktivieren/deaktivieren, ohne Menü zu schließen
Rechtsklick auf Stil zum Öffnen im Editor
Verwenden des in "view_source.editor.path" angegebenen Editors
Ordner kann geändert werden, indem ein Pfad in "UserCSSLoader.FOLDER" eingefügt wird
**** Anleitung Ende ****/
(function(){
let { classes: Cc, interfaces: Ci, utils: Cu, results: Cr } = Components;
if (!window.Services)
Cu.import("resource://gre/modules/Services.jsm");
// Wenn beim Start ein anderes Fenster angezeigt wird (das zweite Fenster), wird es beendet
let list = Services.wm.getEnumerator("navigator:browser");
while(list.hasMoreElements()){ if(list.getNext() != window) return; }
if (window.UCL) {
window.UCL.destroy();
delete window.UCL;
}
const XULNS = "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
window.UCL = {
// vFileManager: 'C:\\Programme\\totalcmd\\TOTALCMD.EXE',
vFileManager: '',
USE_UC: "UC" in window,
AGENT_SHEET: Ci.nsIStyleSheetService.AGENT_SHEET,
USER_SHEET : Ci.nsIStyleSheetService.USER_SHEET,
AUTHOR_SHEET: Ci.nsIStyleSheetService.AUTHOR_SHEET,
readCSS : {},
get disabled_list() {
let obj = [];
try {
obj = this.prefs.getCharPref("disabled_list").split("|");
} catch(e) {}
delete this.disabled_list;
return this.disabled_list = obj;
},
get prefs() {
delete this.prefs;
return this.prefs = Services.prefs.getBranch("UserCSSLoader.")
},
get styleSheetServices(){
delete this.styleSheetServices;
return this.styleSheetServices = Cc["@mozilla.org/content/style-sheet-service;1"].getService(Ci.nsIStyleSheetService);
},
get FOLDER() {
let aFolder;
try {
// UserCSSLoader.FOLDER verwenden
let folderPath = this.prefs.getCharPref("FOLDER");
aFolder = Cc["@mozilla.org/file/local;1"].createInstance(Ci.nsIFile)
aFolder.initWithPath(folderPath);
} catch (e) {
aFolder = Services.dirsvc.get("UChrm", Ci.nsIFile);
aFolder.appendRelativePath("CSS");
}
if (!aFolder.exists() || !aFolder.isDirectory()) {
aFolder.create(Ci.nsIFile.DIRECTORY_TYPE, 0664);
}
delete this.FOLDER;
return this.FOLDER = aFolder;
},
getFocusedWindow: function() {
let win = document.commandDispatcher.focusedWindow;
if (!win || win == window) win = content;
return win;
},
init: function() {
const cssmenu = $C("menu", {
id: "usercssloader-menu",
label: "CSS",
accesskey: "C",
onclick: "if (event.button == 1) UCL.rebuild()"
});
const menupopup = $C("menupopup", {
id: "usercssloader-menupopup"
});
cssmenu.appendChild(menupopup);
let menu = $C("menu", {
label: "Style Loader Menü",
accesskey: "M"
});
menupopup.appendChild(menu);
let mp = $C("menupopup", { id: "usercssloader-submenupopup" });
menu.appendChild(mp);
mp.appendChild($C("menuitem", {
label: "Styles importieren",
accesskey: "R",
acceltext: "Alt + R",
oncommand: "UCL.rebuild();"
}));
mp.appendChild($C("menuseparator"));
mp.appendChild($C("menuitem", {
label: "CSS Datei erstellen",
accesskey: "D",
oncommand: "UCL.create();"
}));
mp.appendChild($C("menuitem", {
label: "CSS Ordner öffnen",
accesskey: "O",
oncommand: "UCL.openFolder();"
}));
mp.appendChild($C("menuitem", {
label: "userChrome.css bearbeiten",
hidden: false,
oncommand: "UCL.editUserCSS(\'userChrome.css\');"
}));
mp.appendChild($C("menuitem", {
label: "userContent.css bearbeiten",
hidden: false,
oncommand: "UCL.editUserCSS(\'userContent.css\');"
}));
mp.appendChild($C("menuseparator"));
mp.appendChild($C("menuitem", {
label: "Style Test (Chrome)",
id: "usercssloader-test-chrome",
hidden: true,
accesskey: "C",
oncommand: "UCL.styleTest(window);"
}));
mp.appendChild($C("menuitem", {
label: "Style Test (Web)",
id: "usercssloader-test-content",
hidden: true,
accesskey: "W",
oncommand: "UCL.styleTest();"
}));
mp.appendChild($C("menuitem", {
label: "Styles dieser Seite auf userstyles.org finden",
accesskey: "S",
oncommand: "UCL.searchStyle();"
}));
menu = $C("menu", {
label: ".uc.css",
accesskey: "U",
hidden: !UCL.USE_UC
});
menupopup.appendChild(menu);
mp = $C("menupopup", { id: "usercssloader-ucmenupopup" });
menu.appendChild(mp);
mp.appendChild($C("menuitem", {
label: "Importieren(.uc.js)",
oncommand: "UCL.UCrebuild();"
}));
mp.appendChild($C("menuseparator", { id: "usercssloader-ucseparator" }));
CustomizableUI.createWidget({
id: 'usercssloader-menu-item',
type: 'custom',
defaultArea: CustomizableUI.AREA_NAVBAR,
onBuild: function(aDocument) {
let toolbaritem = aDocument.createElementNS('http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul', 'toolbaritem');
toolbaritem.id = 'usercssloader-menu-item';
toolbaritem.className = 'chromeclass-toolbar-additional';
return toolbaritem;
}
});
$('usercssloader-menu-item').appendChild(cssmenu);
let refNode = $('helpMenu');
refNode.parentNode.insertBefore(cssmenu, refNode.nextSibling);
$("mainKeyset").appendChild($C("key", {
id: "usercssloader-rebuild-key",
oncommand: "UCL.rebuild();",
key: "R",
modifiers: "alt",
}));
this.rebuild();
this.initialized = true;
if (UCL.USE_UC) {
setTimeout(function() {
UCL.UCcreateMenuitem();
}, 1000);
}
window.addEventListener("unload", this, false);
},
uninit: function() {
const dis = [];
for (let x of Object.keys(this.readCSS)) {
if (!this.readCSS[x].enabled)
dis.push(x);
}
this.prefs.setCharPref("disabled_list", dis.join("|"));
window.removeEventListener("unload", this, false);
},
destroy: function() {
var i = document.getElementById("usercssloader-menu");
if (i) i.parentNode.removeChild(i);
var i = document.getElementById("usercssloader-rebuild-key");
if (i) i.parentNode.removeChild(i);
this.uninit();
},
handleEvent: function(event) {
switch(event.type){
case "unload": this.uninit(); break;
}
},
rebuild: function() {
let ext = /\.css$/i;
let not = /\.uc\.css/i;
let files = this.FOLDER.directoryEntries.QueryInterface(Ci.nsISimpleEnumerator);
while (files.hasMoreElements()) {
let file = files.getNext().QueryInterface(Ci.nsIFile);
if (!ext.test(file.leafName) || not.test(file.leafName)) continue;
let CSS = this.loadCSS(file);
CSS.flag = true;
}
for (let leafName of Object.keys(this.readCSS)) {
const CSS = this.readCSS[leafName];
if (!CSS.flag) {
CSS.enabled = false;
delete this.readCSS[leafName];
}
delete CSS.flag;
this.rebuildMenu(leafName);
}
if (this.initialized) {
if (typeof(StatusPanel) !== "undefined")
StatusPanel._label = "Style importiert";
else
XULBrowserWindow.statusTextField.label = "Styles importieren";
}
},
loadCSS: function(aFile) {
var CSS = this.readCSS[aFile.leafName];
if (!CSS) {
CSS = this.readCSS[aFile.leafName] = new CSSEntry(aFile);
if (this.disabled_list.indexOf(CSS.leafName) === -1) {
CSS.enabled = true;
}
} else if (CSS.enabled) {
CSS.enabled = true;
}
return CSS;
},
rebuildMenu: function(aLeafName) {
var CSS = this.readCSS[aLeafName];
var menuitem = document.getElementById("usercssloader-" + aLeafName);
if (!CSS) {
if (menuitem)
menuitem.parentNode.removeChild(menuitem);
return;
}
if (!menuitem) {
menuitem = $C("menuitem", {
label : aLeafName,
id : "usercssloader-" + aLeafName,
class : "usercssloader-item " + (CSS.SHEET == this.AGENT_SHEET? "AGENT_SHEET" : CSS.SHEET == this.AUTHOR_SHEET? "AUTHOR_SHEET": "USER_SHEET"),
type : "checkbox",
autocheck : "false",
oncommand : "UCL.toggle('"+ aLeafName +"');",
onclick : "UCL.itemClick(event);"
});
document.getElementById("usercssloader-menupopup").appendChild(menuitem);
}
menuitem.setAttribute("checked", CSS.enabled);
},
toggle: function(aLeafName) {
var CSS = this.readCSS[aLeafName];
if (!CSS) return;
CSS.enabled = !CSS.enabled;
this.rebuildMenu(aLeafName);
},
itemClick: function(event) {
if (event.button == 0) return;
event.preventDefault();
event.stopPropagation();
let label = event.currentTarget.getAttribute("label");
if (event.button == 1) {
this.toggle(label);
}
else if (event.button == 2) {
closeMenus(event.target);
this.edit(this.getFileFromLeafName(label));
}
},
getFileFromLeafName: function(aLeafName) {
let f = this.FOLDER.clone();
f.QueryInterface(Ci.nsIFile); // use appendRelativePath
f.appendRelativePath(aLeafName);
return f;
},
styleTest: function(aWindow) {
aWindow || (aWindow = this.getFocusedWindow());
new CSSTester(aWindow, function(tester){
if (tester.saved)
UCL.rebuild();
});
},
searchStyle: function() {
let word;
try {
word = gBrowser.currentURI.host;
} catch {
word = gBrowser.currentURI.spec;
}
openWebLinkIn("https://userstyles.org/styles/search/" + word, "tab", {});
},
openFolder:function(){
if (this.vFileManager.length != 0) {
var file = Cc['@mozilla.org/file/local;1'].createInstance(Ci.nsIFile);
var process = Cc['@mozilla.org/process/util;1'].createInstance(Ci.nsIProcess);
var args=[this.FOLDER.path];
file.initWithPath(this.vFileManager);
process.init(file);
// Verzeichnis mit anderem Dateimanager öffnen
process.run(false, args, args.length);
} else {
// Verzeichnis mit Dateimanager des Systems öffnen
this.FOLDER.launch();
}
},
editUserCSS: function(aLeafName) {
let file = Services.dirsvc.get("UChrm", Ci.nsIFile);
file.appendRelativePath(aLeafName);
this.edit(file);
},
edit: function(aFile) {
var editor = Services.prefs.getCharPref("view_source.editor.path");
if (!editor) return alert("Unter about:config den vorhandenen Schalter:\n view_source.editor.path mit dem Editorpfad ergänzen");
try {
var UI = Components.classes["@mozilla.org/intl/scriptableunicodeconverter"].createInstance(Components.interfaces.nsIScriptableUnicodeConverter);
UI.charset = window.navigator.platform.toLowerCase().indexOf("win") >= 0? "Shift_JIS": "UTF-8";
var path = UI.ConvertFromUnicode(aFile.path);
var app = Components.classes["@mozilla.org/file/local;1"].createInstance(Components.interfaces.nsIFile);
app.initWithPath(editor);
var process = Components.classes["@mozilla.org/process/util;1"].createInstance(Components.interfaces.nsIProcess);
process.init(app);
process.run(false, [path], 1);
} catch (e) {}
},
create: function(aLeafName) {
if (!aLeafName) aLeafName = prompt("Name des Styles", dateFormat(new Date(), "%Y_%m%d_%H%M%S"));
if (aLeafName) aLeafName = aLeafName.replace(/\s+/g, " ").replace(/[\\/:*?\"<>|]/g, "");
if (!aLeafName || !/\S/.test(aLeafName)) return;
if (!/\.css$/.test(aLeafName)) aLeafName += ".css";
let file = this.getFileFromLeafName(aLeafName);
this.edit(file);
},
UCrebuild: function() {
let re = /^file:.*\.uc\.css(?:\?\d+)?$/i;
let query = "?" + new Date().getTime();
Array.slice(document.styleSheets).forEach(function(css){
if (!re.test(css.href)) return;
if (css.ownerNode) {
css.ownerNode.parentNode.removeChild(css.ownerNode);
}
let pi = document.createProcessingInstruction('xml-stylesheet','type="text/css" href="'+ css.href.replace(/\?.*/, '') + query +'"');
document.insertBefore(pi, document.documentElement);
});
UCL.UCcreateMenuitem();
},
UCcreateMenuitem: function() {
let sep = $("usercssloader-ucseparator");
let popup = sep.parentNode;
if (sep.nextSibling) {
let range = document.createRange();
range.setStartAfter(sep);
range.setEndAfter(popup.lastChild);
range.deleteContents();
range.detach();
}
let re = /^file:.*\.uc\.css(?:\?\d+)?$/i;
Array.slice(document.styleSheets).forEach(function(css) {
if (!re.test(css.href)) return;
let fileURL = decodeURIComponent(css.href).split("?")[0];
let aLeafName = fileURL.split("/").pop();
let m = $C("menuitem", {
label : aLeafName,
tooltiptext : fileURL,
id : "usercssloader-" + aLeafName,
type : "checkbox",
autocheck : "false",
checked : "true",
oncommand : "this.setAttribute('checked', !(this.css.disabled = !this.css.disabled));",
onclick : "UCL.UCItemClick(event);"
});
m.css = css;
popup.appendChild(m);
});
},
UCItemClick: function(event) {
if (event.button == 0) return;
event.preventDefault();
event.stopPropagation();
if (event.button == 1) {
event.target.doCommand();
}
else if (event.button == 2) {
closeMenus(event.target);
let fileURL = event.currentTarget.getAttribute("tooltiptext");
let file = Services.io.getProtocolHandler("file").QueryInterface(Components.interfaces.nsIFileProtocolHandler).getFileFromURLSpec(fileURL);
this.edit(file);
}
},
};
function CSSEntry(aFile) {
this.path = aFile.path;
this.leafName = aFile.leafName;
this.lastModifiedTime = 1;
this.SHEET = /^xul-|\.as\.css$/i.test(this.leafName) ?
Ci.nsIStyleSheetService.AGENT_SHEET:
/\.author\.css$/i.test(this.leafName)?
Ci.nsIStyleSheetService.AUTHOR_SHEET:
Ci.nsIStyleSheetService.USER_SHEET;
}
CSSEntry.prototype = {
sss: Components.classes["@mozilla.org/content/style-sheet-service;1"]
.getService(Components.interfaces.nsIStyleSheetService),
_enabled: false,
get enabled() {
return this._enabled;
},
set enabled(isEnable) {
var aFile = Components.classes["@mozilla.org/file/local;1"].createInstance(Components.interfaces.nsIFile)
aFile.initWithPath(this.path);
var isExists = aFile.exists(); // Wenn die Datei existiert true
var lastModifiedTime = isExists ? aFile.lastModifiedTime : 0;
var isForced = this.lastModifiedTime != lastModifiedTime; // Wenn es eine Änderung in der Datei gibt true
var fileURL = Services.io.getProtocolHandler("file").QueryInterface(Components.interfaces.nsIFileProtocolHandler).getURLSpecFromActualFile(aFile);
var uri = Services.io.newURI(fileURL, null, null);
if (this.sss.sheetRegistered(uri, this.SHEET)) {
// Wenn diese Datei bereits gelesen wurde
if (!isEnable || !isExists) {
this.sss.unregisterSheet(uri, this.SHEET);
}
else if (isForced) {
// Nach Stornierung erneut einlesen
this.sss.unregisterSheet(uri, this.SHEET);
this.sss.loadAndRegisterSheet(uri, this.SHEET);
}
} else {
// Datei wurde nicht gelesen
if (isEnable && isExists) {
this.sss.loadAndRegisterSheet(uri, this.SHEET);
}
}
if (this.lastModifiedTime !== 1 && isEnable && isForced) {
log(this.leafName + " wurde aktualisiert");
}
this.lastModifiedTime = lastModifiedTime;
return this._enabled = isEnable;
},
};
function CSSTester(aWindow, aCallback) {
this.win = aWindow || window;
this.doc = this.win.document;
this.callback = aCallback;
this.init();
}
CSSTester.prototype = {
sss: Components.classes["@mozilla.org/content/style-sheet-service;1"]
.getService(Components.interfaces.nsIStyleSheetService),
preview_code: "",
saved: false,
init: function() {
this.dialog = openDialog(
"data:text/html;charset=utf8,"+encodeURIComponent('<!DOCTYPE HTML><html lang="de"><head><title>CSSTester</title></head><body></body></html>'),
"",
"width=550,height=400,dialog=no");
this.dialog.addEventListener("load", this, false);
},
destroy: function() {
this.preview_end();
this.dialog.removeEventListener("unload", this, false);
this.previewButton.removeEventListener("click", this, false);
this.saveButton.removeEventListener("click", this, false);
this.closeButton.removeEventListener("click", this, false);
},
handleEvent: function(event) {
switch(event.type) {
case "click":
if (event.button != 0) return;
if (this.previewButton == event.currentTarget) {
this.preview();
}
else if (this.saveButton == event.currentTarget) {
this.save();
}
else if (this.closeButton == event.currentTarget) {
this.dialog.close();
}
break;
case "load":
var doc = this.dialog.document;
doc.body.innerHTML = '\
<style type="text/css">\
:not(input):not(select) { padding: 0px; margin: 0px; }\
table { border-spacing: 0px; }\
body, html, #main, #textarea { width: 100%; height: 100%; }\
#textarea { font-family: monospace; }\
</style>\
<table id="main">\
<tr height="100%">\
<td colspan="4"><textarea id="textarea"></textarea></td>\
</tr>\
<tr height="40">\
<td><input type="button" value="Vorschau" id="Vorschau"/></td>\
<td><input type="button" value="Speichern" id="Speichern"/></td>\
<td width="80%"><span class="log"></span></td>\
<td><input type="button" value="Schließen" id="Schliessen"/></td>\
</tr>\
</table>\
';
this.textbox = doc.querySelector("textarea");
this.previewButton = doc.querySelector('input[value="Vorschau"]');
this.saveButton = doc.querySelector('input[value="Speichern"]');
this.closeButton = doc.querySelector('input[value="Schließen"]');
this.logField = doc.querySelector('.log');
var code = "@namespace url(" + this.doc.documentElement.namespaceURI + ");\n";
code += this.win.location.protocol.indexOf("http") === 0?
"@-moz-document domain(" + this.win.location.host + ") {\n\n\n\n}":
"@-moz-document url(" + this.win.location.href + ") {\n\n\n\n}";
this.textbox.value = code;
this.dialog.addEventListener("unload", this, false);
this.previewButton.addEventListener("click", this, false);
this.saveButton.addEventListener("click", this, false);
this.closeButton.addEventListener("click", this, false);
this.textbox.focus();
let p = this.textbox.value.length - 3;
this.textbox.setSelectionRange(p, p);
break;
case "unload":
this.destroy();
this.callback(this);
break;
}
},
preview: function() {
var code = this.textbox.value;
if (!code || !/\:/.test(code))
return;
code = "data:text/css;charset=utf-8," + encodeURIComponent(this.textbox.value);
if (code == this.preview_code)
return;
this.preview_end();
var uri = Services.io.newURI(code, null, null);
this.sss.loadAndRegisterSheet(uri, Ci.nsIStyleSheetService.AGENT_SHEET);
this.preview_code = code;
this.log("Preview");
},
preview_end: function() {
if (this.preview_code) {
let uri = Services.io.newURI(this.preview_code, null, null);
this.sss.unregisterSheet(uri, Ci.nsIStyleSheetService.AGENT_SHEET);
this.preview_code = "";
}
},
save: function() {
var data = this.textbox.value;
if (!data) return;
var fp = Cc["@mozilla.org/filepicker;1"].createInstance(Ci.nsIFilePicker);
fp.init(window, "", Ci.nsIFilePicker.modeSave);
fp.appendFilter("CSS Files","*.css");
fp.defaultExtension = "css";
if (window.UCL)
fp.displayDirectory = UCL.FOLDER;
var res = fp.show();
if (res != fp.returnOK && res != fp.returnReplace) return;
var suConverter = Cc["@mozilla.org/intl/scriptableunicodeconverter"].createInstance(Ci.nsIScriptableUnicodeConverter);
suConverter.charset = "UTF-8";
data = suConverter.ConvertFromUnicode(data);
var foStream = Cc["@mozilla.org/network/file-output-stream;1"].createInstance(Ci.nsIFileOutputStream);
foStream.init(fp.file, 0x02 | 0x08 | 0x20, 0664, 0);
foStream.write(data, data.length);
foStream.close();
this.saved = true;
},
log: function() {
this.logField.textContent = dateFormat(new Date(), "%H:%M:%S") + ": " + $A(arguments);
}
};
UCL.init();
function $(id) { return document.getElementById(id); }
function $A(arr) { return Array.slice(arr); }
function $C(name, attr) {
var el = document.createXULElement(name);
if (attr) Object.keys(attr).forEach(function(n) { el.setAttribute(n, attr[n]) });
return el;
}
function dateFormat(date, format) {
format = format.replace("%Y", ("000" + date.getFullYear()).substr(-4));
format = format.replace("%m", ("0" + (date.getMonth()+1)).substr(-2));
format = format.replace("%d", ("0" + date.getDay()).substr(-2));
format = format.replace("%H", ("0" + date.getHours()).substr(-2));
format = format.replace("%M", ("0" + date.getMinutes()).substr(-2));
format = format.replace("%S", ("0" + date.getSeconds()).substr(-2));
return format;
}
function log() { Application.console.log(Array.slice(arguments)); }
})();
Alles anzeigen
Wie man sieht unterstützt sie jetzt auch Author_Sheet:
AGENT_SHEET: Ci.nsIStyleSheetService.AGENT_SHEET,
USER_SHEET : Ci.nsIStyleSheetService.USER_SHEET,
AUTHOR_SHEET: Ci.nsIStyleSheetService.AUTHOR_SHEET,
Quelle kann ich keine Angeben, da das Original Script von Griever
nicht mehr geht. Aborix und andere Leute aus Asien haben es
dann wieder laufffähig gemacht. Die aktuelle Änderung habe ich in
einem Script aus den asiatischen Tiefen gefunden, und dann in unsere
Version übertragen.
Mfg.
Endor
Kinder zu bekommen einfacher.
Ich kenne da einige Frauen, die da eine ganz eigene Meinung zum Thema "schwere Geburt" haben!
Hauptsache "dein Baby" passt jetzt so für dich...
Endor : Ja, muss ich mir auch mal anschauen, klingt nicht uninteressant -> "AUTHOR_SHEET". Obwohl, lässt sich natürlich auch mit einem JavaScript so starten . Mal schauen was komfortabler ist...
Verstehe ich das richtig?
Hätte ich das usercssloader.uc.js Monster gehabt,
hätte ich ein ganz normales CSS schreiben können?
Grrr.
Ja könnte eventuell so sein.
Aber Deine Version die Du gemacht hast ist definitiv die bessere
Variante, da sie unabhängig von anderen Scripten funktioniert.
Übrigens klasse Arbeit!!!
Mfg.
Endor
Hätte ich das usercssloader.uc.js Monster gehabt,
hätte ich ein ganz normales CSS schreiben können?
Hättest du in deinem Script auch. Die Schreibweise mit dem \ nach jeder Zeile ist nur eine Möglichkeit. Seit ECMAScript 6 (a.k.a. ECMAScript 2015)* gibt es auch eine andere Schreibweise, die kein spezielles Zeichen nach jeder Zeile verlangt und damit im Prinzip „normales CSS“ ist.
*) ECMAScript ist der Standard, auf dem JavaScript basiert.
Die Funktionsweise sogenannter Template Literals ist wie folgt:
var uri = Services.io.newURI("data:text/css;charset=utf-8," + encodeURIComponent('
…
'), null, null);
Ersetze ' durch `:
var uri = Services.io.newURI("data:text/css;charset=utf-8," + encodeURIComponent(`
…
`), null, null);
Ersetze die Zuweisung von Variablen.
Beispiel Alt:
Beispiel Neu:
Abschließend: Entferne alle \.
Hätte ich das usercssloader.uc.js Monster gehabt,
hätte ich ein ganz normales CSS schreiben können?
Hättest du in deinem Script im Prinzip auch. Die Schreibweise mit dem \ nach jeder Zeile ist nur eine Möglichkeit. Seit ECMAScript 6 (a.k.a. ECMAScript 2015)* gibt es auch eine andere Schreibweise, die kein spezielles Zeichen nach jeder Zeile verlangt und damit im Prinzip „normales CSS“ ist.
*) ECMA ist der Standard, auf dem JavaScript basiert.
...
Cool.
Und vielen Dank,
nur was mach ich mit der letzten Zeile?
ss.loadAndRegisterSheet(uri, ss.AGENT_SHEET);
}
};
// enable settings as configured above
custom_scrollbars.init()
Zeile 194 wird im Visual Studio Code als Fehler gemarkert!
Dadurch funktioniert das ganze Script natürlich nicht.
Wie muss der Code also abgeschlossen werden?
nur was mach ich mit der letzten Zeile?
Gar nichts. Das Ende der öffnenden Funktion habe ich ja auch oben gezeigt. Es gibt insgesamt zwei Stellen, an denen du ' durch ` ersetzen musst: vor dem CSS und nach dem CSS.
Ups.
Zeile 186 => '), null, null);
Vergessen.
Das "neue" JavaScript,
inkl. Korrekturen und mit Sörens Vorschlag geändert!
"use strict";
/* Firefox 57+ userChrome.js tweaks - SCROLLBARS ********************************************** */
/* Original by Aris (aris-addons@gmx.net)****************************************************** */
/* Github: https://github.com/aris-t2/customscrollbarsforfx *********************************** */
/* ******************************************************************************************** */
/* Customized by Mira************************************************************************** */
/* version 2 nach (ECMAScript 2015) *********************************************************** */
/* https://www.camp-firefox.de/forum/thema/135133-custom-scrollbars-uc-js-anpassen/ *********** */
/* ******************************************************************************************** */
/* Custom Scrollbars for Firefox ************************************************************** */
/* version 1.0.6 ****************************************************************************** */
/* ***********************************************************************************************
README
!!! Wichtig !!!
Die Einstellungen müssen auf 'false' gesetzt werden, damit dies auf aktuellen Firefox-Builds (102+) funktioniert
about:config >
widget.windows.overlay-scrollbars.enabled > false (Windows)
widget.gtk.overlay-scrollbars.enabled > false (Linux/MacOSX)
[!] 'Methode 2' ist erforderlich, um Firefox für benutzerdefinierte JavaScript-Dateien vorzubereiten
[!] Die Datei 'custom_scrollbars.uc.js' gehört in den Firefox-Profilordner 'chrome'!
-> Profilordner finden: Adressleiste > about:profiles > Wurzelordner > Ordner öffnen
-> Datei zum Ordner \chrome\ hinzufügen (ggf. einen Ordner mit Namen "chrome" erstellen)
[!] 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
Aktivieren einer Einstellung > var ... auf 'true' setzen
Deaktivieren einer Einstellung > var ... auf 'false' setzen
Anpassungen vornehmen > Werte ändern
- Farbe - Name: red, blue, transparent / Hexcode: #33CCFF, #FFF
- Farbe - rgb(a): rgba(0,0,255,0.8) / hsl(a): hsla(240,100%,50%,0.8) // a = Sichtbarkeit (transparenz)
- Zahlen: 1, 2, 3 ... 10, 11, 12 ...
- Deckkraft (in Dezimalzahlen): 0.0 bis 1.0 z.B. 1.4, 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))
HINWEIS
- Zu kleine Werte für die Scrollbar-Breite werden sich negativ auf einige Oberflaechenelemente auswirken!
*********************************************************************************************** */
// GENERAL SCROLLBAR SETTINGS
var custom_scrollbar_size_value = 16; // in px // default: custom_scrollbar_size_value = 17
var custom_opacity_value = "1.0"; // default: custom_opacity_value = "1.0"
// CUSTOM SCROLLBAR SETTINGS ("custom_scrollbar_" --> "cs_")
var cs_thumb_border = 1; // in px // default: cs_thumb_border = 0 // Rahmen des Sliders
var cs_thumb_roundness = 15; // in px // default: cs_thumb_roundness = 0 // Rundung des Sliders
var cs_thumb_minimal_size = 12; // in px
// CUSTOM SCROLLBAR COLORS/GRADIENTS
// - background
var cs_background_color = "#5b5b66"; // default: cs_background_color = "#DDDDDD"
var cs_background_image_vertical = "unset"; // default: cs_background_image_vertical = "unset"
var cs_background_image_horizontal = "unset"; // default: cs_background_image_horizontal = "unset"
// - corner
var cs_corner_background_color = "#bfbfbf"; // default: cs_corner_background_color = "#DDDDDD"
var cs_corner_background_image = "unset"; // default: cs_corner_background_image = "unset"
// - thumb/slider
var cs_thumb_color = "#bfbfbf"; // default: cs_thumb_color = "#33CCFF"
var cs_thumb_image_vertical = "unset"; // default: cs_thumb_image_vertical = "unset"
var cs_thumb_image_horizontal = "unset"; // default: cs_thumb_image_horizontal = "unset"
var cs_thumb_hover_color = "orange"; // default: cs_thumb_hover_color = "#66FFFF"
var cs_thumb_hover_image_vertical = "unset"; // default: cs_thumb_hover_image_vertical = "unset"
var cs_thumb_hover_image_horizontal = "unset"; // default: cs_thumb_hover_image_horizontal = "unset"
var cs_thumb_border_color = "#5b5b66"; // default: cs_thumb_border_color = "#33CCFF" "#5b5b66"
// - buttons
var cs_buttons_image_vertical = "unset"; // default: cs_buttons_image_vertical = "unset"
var cs_buttons_image_horizontal = "unset"; // default: cs_buttons_image_horizontal = "unset"
var cs_buttons_hover_color = "#bfbfbf"; // default: cs_buttons_hover_color = "#33CCFF"
var cs_buttons_hover_image_vertical = "unset"; // default: cs_buttons_hover_image_vertical = "unset"
var cs_buttons_hover_image_horizontal = "unset"; // default: cs_buttons_hover_image_horizontal = "unset"
var cs_color_arrow = "#bfbfbf";
var cs_color_arrow_hover = "orange";
var cs_width = 16;
var cs_height = 16;
/* ******************************************************************************************** */
/* ******************************************************************************************** */
/* ******************************************************************************************** */
// Scrollbar code
Components.utils.import("resource://gre/modules/Services.jsm");
var ss = Components.classes["@mozilla.org/content/style-sheet-service;1"].getService(Components.interfaces.nsIStyleSheetService);
var custom_scrollbars = {
init: function() {
var uri = Services.io.newURI("data:text/css;charset=utf-8," + encodeURIComponent(`
@namespace html url("http://www.w3.org/1999/xhtml");
scrollbar, scrollcorner, scrollbar thumb,
scrollbar[orient="vertical"] scrollbarbutton[type="increment"],
scrollbar[orient="vertical"] scrollbarbutton[type="decrement"],
scrollbar[orient="horizontal"] scrollbarbutton[type="increment"],
scrollbar[orient="horizontal"] scrollbarbutton[type="decrement"] {
-moz-appearance: none !important;
appearance: none !important;
}
scrollbar {
background-color: ${cs_background_color} !important;
}
scrollbar[orient="vertical"] {
background-image: ${cs_background_image_vertical} !important;
}
scrollbar[orient="horizontal"] {
background-image: ${cs_background_image_horizontal} !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;
border: ${cs_thumb_border}px solid ${cs_thumb_border_color} !important;
}
scrollbar thumb[orient="vertical"] {
background-image: ${cs_thumb_image_vertical} !important;
min-height: ${(cs_thumb_minimal_size+cs_thumb_roundness+cs_thumb_border)}px !important;
}
scrollbar thumb[orient="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[orient="vertical"]:hover, scrollbar thumb[orient="vertical"]:active,
scrollbar thumb[orient="horizontal"]:hover, scrollbar thumb[orient="horizontal"]:active {
background-image: ${cs_thumb_hover_image_vertical} !important;
}
scrollbar[orient="vertical"] scrollbarbutton[type="decrement"] {
mask-image: url("file:///C:/Users/.../chrome/icons/Chevron-up,_12.svg") !important;
}
scrollbar[orient="vertical"] scrollbarbutton[type="increment"] {
mask-image: url("file:///C:/Users/.../chrome/icons/Chevron-down,_12.svg") !important;
}
scrollbar[orient="horizontal"] scrollbarbutton[type="increment"] {
mask-image: url("file:///C:/Users/.../chrome/icons/Chevron-right,_12.svg") !important;
}
scrollbar[orient="horizontal"] scrollbarbutton[type="decrement"] {
mask-image: url("file:///C:/Users/.../chrome/icons/Chevron-left,_12.svg") !important;
}
scrollbarbutton[type="increment"],
scrollbar[orient="vertical"] scrollbarbutton[type="decrement"],
scrollbarbutton[type="increment"],
scrollbar[orient="horizontal"] scrollbarbutton[type="decrement"] {
mask-repeat: no-repeat;
mask-position: center;
background-color: ${cs_color_arrow};
width: ${cs_width}px !important;
height: ${cs_height}px !important;
}
scrollbarbutton[type="increment"]:hover,
scrollbar[orient="vertical"] scrollbarbutton[type="decrement"]:hover,
scrollbarbutton[type="increment"]:hover,
scrollbar[orient="horizontal"] scrollbarbutton[type="decrement"]:hover {
background-color: ${cs_color_arrow_hover} !important;
}
scrollbar[orient="vertical"] {
background-image: ${cs_background_image_vertical} !important;
width: ${custom_scrollbar_size_value}px !important;
}
scrollbar[orient="horizontal"] {
background-image: ${cs_background_image_horizontal} !important;
height: ${custom_scrollbar_size_value}px !important;
}
scrollcorner {
background-color: ${cs_corner_background_color} !important;
background-image: url("file:///C:/Users/.../chrome/icons/resizer.svg") !important;
width: ${custom_scrollbar_size_value}px !important;
}
`), null, null);
ss.loadAndRegisterSheet(uri, ss.AGENT_SHEET);
}
};
// enable settings as configured above
custom_scrollbars.init();
Alles anzeigen
Viel Spass damit, vor allem beim Basteln.
Super. Jetzt musst du nur noch alle var ersetzen, damit die IDE des Vertrauens (in meinem Fall PhpStorm) nicht mehr jedes var unterkringelt. Normalerweise sollte alles zu const werden können, da ja nichts nachträglich überschrieben wird, ansonsten eben let.
Und folgende Variablen-Deklarationen kannst du entfernen, weil diese im CSS überhaupt nicht mehr berücksichtigt werden:
Zwei Typos in den Kommentaren noch, weil wir ja perfekt sein wollen:
Super. Jetzt musst du nur noch alle var ersetzen, damit die IDE des Vertrauens (in meinem Fall PhpStorm) nicht mehr jedes var unterkringelt. Normalerweise sollte alles zu const werden können, da ja nichts nachträglich überschrieben wird, ansonsten eben let.
Zwei Typos in den Kommentaren noch, weil wir ja perfekt sein wollen:
- Javascipt -> JavaScript
- Deckkraft (in Dezimalzahlen): 0.0 bis 1.0 z.B. 1.4, 1,75 -> das Komma am Ende sollte ein Punkt sein
Die Zeile mit der Deckkraft habe ich aber aus dem "Original" so übernommen.
geändert in - Deckkraft (in Dezimalzahlen): 0.0 bis 1.0 z.B. 1.4 oder 1,75
Und folgende Variablen-Deklarationen kannst du entfernen, weil diese im CSS überhaupt nicht mehr berücksichtigt werden:
- custom_opacity_value
- cs_thumb_hover_image_horizontal
- cs_buttons_image_vertical
- cs_buttons_image_horizontal
- cs_buttons_hover_color
- cs_buttons_hover_image_vertical
- cs_buttons_hover_image_horizontal
Gelöscht.
Super. Jetzt musst du nur noch alle var ersetzen, damit die IDE des Vertrauens (in meinem Fall PhpStorm) nicht mehr jedes var unterkringelt. Normalerweise sollte alles zu const werden können, da ja nichts nachträglich überschrieben wird, ansonsten eben let.
Erledigt. Ist aber wohl nur eine Schönheitskorrektur?
var => Variable
const => Konstande
Macht für mich eigentlich Variable mehr Sinn, ist aber geändert.
Die Zeile mit der Deckkraft habe ich aber aus dem "Original" so übernommen.
geändert in - Deckkraft (in Dezimalzahlen): 0.0 bis 1.0 z.B. 1.4 oder 1,75
Ich meinte 1,75 muss 1.75 heißen.
Erledigt. Ist aber wohl nur eine Schönheitskorrektur?
var => Variable
const => Konstande
Macht für mich eigentlich Variable mehr Sinn, ist aber geändert.
Nein, nicht nur eine Schönheitskorrektur, es gibt Unterschiede zwischen var, let und const. Siehe:
In modernem JavaScript verwendet man normalerweise überhaupt kein var mehr. Wo const nicht funktioniert, weil der Wert an anderer Stelle überschrieben wird, kann stattdessen let genutzt werden.