Ramnips Homepage-Help      www.chathomepage.de  
CSS - Mauscursor & Scrollbar

« Zurück zur CSS-Auswahl

Mauscursor verändern

Start Bereich 1
Fadenkreuz
Ende Bereich 1

<style type="text/css"><!--body{cursor:crosshair};a:hover{cursor:crosshair;}--></style>


Start Bereich 2
Elementbewegung
Ende Bereich 2

<style type="text/css"><!--body{cursor:move};a:hover{cursor:move;}--></style>


Start Bereich 3
Hilfe-Symbol
Ende Bereich 3

<style type="text/css"><!--body{cursor:help};a:hover{cursor:help;}--></style>


Start Bereich 4
Warte-Symbol
Ende Bereich 4

<style type="text/css"><!--body{cursor:wait};a:hover{cursor:wait;}--></style>


Start Bereich 5
Pfeil-Symbol
Ende Bereich 5

<style type="text/css"><!--body{cursor:s-resize};a:hover{cursor:s-resize;}--></style>




Scrollbar einfärben (nur Internet-Explorer)

Den CSS Code OHNE Zeilenumbruch (ENTER) in den Editbereich hintereinanderweg schreiben

<style type="text/css"><!--body{scrollbar-face-color: #1F3F5F;scrollbar-highlight-color: #224499;scrollbar-shadow-color: #152B40;scrollbar-3dlight-color: #333333;scrollbar-arrow-color: #FF9900;scrollbar-track-color: #666699;scrollbar-darkshadow-color: #666699}--></style>


Die Farbhexcodes (ggf. auch Namen) können natürlich nach Wunsch verändert werden,
Man kommt um's Testen und Ausprobieren nicht herum.
Den Dreh bekommt man aber raus - beispielsweise ist es ratsam,
shadow und highlight Werte nur leicht heller bzw. dunkler zu setzen als die face-Farbe.

Erläuterungen:
face-color - Grundfarbe des Scrollbalkens
track-color - Farbe des Reglers
3d-light-color - 3D-Effekt an den Pfeilen wird farblich hervorgehoben
highlight-color - Farbe des Reglers bei Aktivierung
shadow-color - Farbe des Schattens
darkshadow-color - Dunkler Schatten des Reglers
arrow-color - Farbe der beiden Pfeile oben / unten

Fertige Vorlagen:
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen

<style type="text/css"><!--body{scrollbar-face-color: #018FFB; scrollbar-track-color: #8DCCFC; scrollbar-arrow-color: #FFFFFF; scrollbar-shadow-color: #0271C5; scrollbar-highligt-color: #8DCCFC; scrollbar-3dlight-color: #018FFB; scrollbar-darkshadow-color: #0271C5;}--></style>
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen

<style type="text/css"><!--body{scrollbar-face-color:#1F3F5F; scrollbar-highlight-color:#224499; scrollbar-shadow-color:#152B40; scrollbar-3dlight-color:#333333; scrollbar-arrow-color:#FF9900; scrollbar-track-color:#666699; scrollbar-darkshadow-color:#666699;}--></style>
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen

<style type="text/css"><!--body{scrollbar-face-color:#BFBFBF; scrollbar-highlight-color:#EFEFEF; scrollbar-3dlight-color:#CFCFCF; scrollbar-darkshadow-color:#5F5F5F; scrollbar-shadow-color:#6F6F6F; scrollbar-arrow-color:#9F0000; scrollbar-track-color:#6F6F6F;}--></style>
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen
Text zum Scrollen

<style type="text/css"><!--body{SCROLLBAR-HIGHLIGHT-COLOR: #fff; SCROLLBAR-SHADOW-COLOR: #bd84d6; SCROLLBAR-3DLIGHT-COLOR: #723a8c; SCROLLBAR-ARROW-COLOR: #300080; SCROLLBAR-TRACK-COLOR: #cf96ea; SCROLLBAR-DARKSHADOW-COLOR: #723a8c; SCROLLBAR-BASE-COLOR: #d9abef;}--></style>