Scrollleiste / Scrollbar verändern

Hallo in einem Forum wurde die scroll leiste verändert,genau genommen in diesem hier: http://formart.forumieren.com/

(normaler weise ist ja diese blaue eckige leiste recht,die hier haben eine rote runde etc.)

da ich per firebug ncihts gefunden habe wollte ich fragen ob das halt von euch mit einem tutorial erklärt wird ?


Lg

Diese Art der Scrollleisten werden nur im IE unterstützt.
Im Adminbereich deines Forums hast du bei den Farbeinstellungen die Möglichkeit hier die Farben zu verändern. Gilt aber nur für den IE.
Man kann das auch im Head Bereich einer Seite definieren.
Was da wie möglich ist, findest du auf einschlägigen HTML Hilfeseiten. Du solltest schon etwas Finden, wenn du mit Google mal danach suchst.
Dort wird genau erklärt, was wie möglich ist.

Edit:
Du kannst die Leisten auch über das CSS definieren.
Schau mal, das hier habe ich nach fünf Sekunden schon gefunden:
http://www.web-toolbox.net/webtoolbox/css/css-scrollbar.htm

Noch mal Edit:
Das wichtigste und auch den richtigen CSS Cide findest du auch in diesem PDF:
http://www.web-toolbox.net/webtoolbox/download/css-scrollbars-referenz.pdf

Einen Generator der dir auch den CSS Code erzeugt findest du hier:
http://www.homepage-buttons.de/tools/scrollbalken-generator.html

Hier werden ja nur die Farben angesprochen, aber du kannst dort auch die Radien und Ränder mit definieren.

naja ich hab crome aber ich sehe die leiste bei formart?!

hmm danke für die vielen links aber komischerweise tut sich nichts,als test wollte ich erstmal alles schwarz machen und später anpassen,aber nichts hat sich verändert,bei farbcode habe ich überall den farbcode für schwarz reingeschrieben (#000000),nichts tut sich,bleibt immer ncoh blau.

Welchen Code hast du denn in dein CSS eingesetzt?

diesen hier:

Code:

body {
scrollbar-arrow-color: #000000;
scrollbarBaseColor: #000000;
scrollbar-track-color: #000000;
scrollbar-face-color: #000000;
scrollbar-highlight-color: #000000;
scrollbar-3dlight-color: #000000;
scrollbar-darkshadow-color: #000000;
scrollbar-shadow-color: #000000;
}

Ich melde mich morgen dazu noch mal.
Ich werde das mal testen.

okay frank

Ach du Schande... Ich habe das voll vergessen.
Können wir das auf Samstag verschieben?
Morgen habe ich auch nicht so viel Zeit.

Oder jemand anderes möchte dir hier helfen.

Wenn, dann erinnere mich bitte am Samstag noch mal daran, ja?

Hallo,

wenn es Frank derzeit zeitlich so knapp hat, dann helfe ich hier gerne vorübergehend aus.

Wie Frank bereits gesagt hat, ist das Verändern der Scrollbar kein W3C-Standard und wird deshalb von Firefox nicht unterstützt. Der IE unterstützt allerdings spezielle Eigenschaften zu genau diesem Effekt. Alle möglichen CSS-Eigenschaften, um die Scrollbar unter dem IE anzupassen, findest du dort:
http://www.css4you.de/ieproperty.html
Damit sämtliche IE-Modi damit arbeiten, muss die Zuweisung sowohl zu html als auch body erfolgen:

Code:

html, body {
  ...
}

Neuerdings unterstützen auch Webkit-Browser (Chrome, Safari) Scrollbar-Zuweisungen. Dazu sind browsereigene CSS-Präfixe nötig - außerdem ist eine Besonderheit, dass es sich um keine Eigenschaften des html/body handelt (wie beim IE), sondern um Pseudoelemente. Wie du damit arbeiten musst, wird dort schön erklärt:
http://www.drweb.de/magazin/css-scrollleisten-in-chrome-individuell-gestalten-36873/
Das bedeutet, dass du unter Chrome nicht nur die Farbe der einzelnen Scrollbar-Pseudoelemente bestimmen kannst ("background-color"), sondern auch weitere optische Eigenschaften wie "border-radius", "width" etc.

Um das Ganze anschaulicher zu machen, habe ich mal einen vollständigen Beispielcode für IE und Chrome zusammengestellt:

Code:

/*-- Scrollbar Farben ändern --*/
/* Internet Explorer*/
html, body {
  scrollbar-arrow-color: #000000;
  scrollbar-base-color: #FF3300;
  scrollbar-face-color: #FF0000;
  scrollbar-track-color: #0000FF;
  scrollbar-3dlight-color: #00FF00;
  scrollbar-darkshadow-color: #00FF00;
  scrollbar-highlight-color: #00FF00;
  scrollbar-shadow-color: #00FF00;
}
/* Webkit-Browser */
::-webkit-scrollbar {
  background-color: #FF3300;
}
::-webkit-scrollbar-button {
  background-color: #000000;
}
::-webkit-scrollbar-track {
  background-color: #FF3300;
}
::-webkit-scrollbar-thumb {
  background-color: #0000FF;
}
/*-- Scrollbar Farben ändern Ende --*/

Das sollte dir weiterhelfen.

Liebe Grüße
Günther

awww vielen vieln dank Günther,jetzt habe ich es so wie ich es mir vorstelle!


Vielen dank auch dir Frank <33

Schön, dann kann ich hier abschließen.
-closed-