Scrollbar

Dieses Beispiel zeigt, wie die Scrollbars in einer XUL-Applikation verändert werden können.  Scrollbars im Browser werden auch gestylt.
(Auf Windows XP getestet)

Das Beispiel setzt die folgende Struktur voraus:

app/chrome/chrome.manifest
app/chrome/skin/global/

Kopieren Sie die scrollbars.css von xulrunner/chrome/classic.jar/skin/classic/global nach app/chrome/skin/global/scrollbars.css

Öffnen Sie app/chrome/chrome.manifest und fügen Sie folgende Zeilen hinzu:

skin app-global standard/1.0 skin/global/
override chrome://global/skin/xulscrollbars.css chrome://app-global/skin/scrollbars.css

xulscrollbars.css wird für Windows XP benutzt, nativescrollbars.css auf OSX. Für OSX, fügen Sie noch folgendes an:

override chrome://global/skin/nativescrollbars.css chrome://app-global/skin/scrollbars.css

Ändern Sie nun ein paar Farbwerte in app/chrome/skin/global/scrollbars.css um zu testen, ob das CSS benutzt wird.

Beispielfenster in XUL:

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>
<window id="sampleWindow" width="320" height="240"
   xmlns="https://www.mozilla.org/keymaster/gat...re.is.only.xul">
<hbox flex="1">
   <browser type="content" src="https://mozilla.org" flex="1"/>
   <scrollbar orient="vertical"/>
</hbox>
</window>