Dynamisches Scollbardesign
Stand vom 15.04.2002
Mit diesem kleinen JavaScript kann man einen kleinen Effekt
nur für den Internet Explorer erreichen. Hierbei ändert
sich die Farbe der Scollbar bei Mausberührung.
Selbst designte Scollbars sind schon etwas tolles. Mit einem kleinen
JavaScript kann man diesen Effekt noch ein wenig "aufmöbeln".
Hierbei ändert sich die Farbe des Scollbalken bei einer Mausberührung.
Hier gehts zu Demo...
<script language="javascript" type="text/javascript">
<!--
function scrollfun()
{
chk = document.body.clientWidth + 2;
if(window.event.x > chk)
{
var sfc = "blue"; //scrollbar-face-color
var ssc = "red"; //scrollbar-shadow-color
var shc = "green"; //scrollbar-highlight-color
var stc = "yellow"; //scrollbar-track-color
var sac = "black"; //scrollbar-arrow-color
document.body.style.scrollbarFaceColor = sfc;
document.body.style.scrollbarShadowColor = ssc;
document.body.style.scrollbarTrackColor = stc;
document.body.style.scrollbarHighlightColor = shc;
document.body.style.scrollbarArrowColor = sac;
}
else
{
var sfc = "orange"; //scrollbar-face-color
var ssc = "red"; //scrollbar-shadow-color
var shc = "white"; //scrollbar-highlight-color
var stc = "silver"; //scrollbar-track-color
var sac = "blue"; //scrollbar-arrow-color
document.body.style.scrollbarFaceColor = sfc;
document.body.style.scrollbarShadowColor = ssc;
document.body.style.scrollbarTrackColor = stc;
document.body.style.scrollbarHighlightColor = shc;
document.body.style.scrollbarArrowColor = sac;
}
}
// -->
</script>
Das Skript spricht über das "document" Objekt die
Style-Eigenschaft des Body-Tags an, und darüber die einzelnen
Farben für die Elemente der Scrollbar.
Wo die Farben definiert werden, ist anhand der Kommentare leicht
zu erkennen.
Das Skript muss explizit über den <body> Tag aufgerufen
werden.
<body onMousemove="scrollfun()">
technisch
HTML