Sicher ist es Ihnen aufgefallen, daß Sie beim Surfen des öfteren mal auf farbige Scrollbars treffen oder daß sich in der URL ein kleines Icon verewigt. Wie geht das?
Zuerst die gute Nachricht. Es funktkioniert unter dem MS Internet Explorer und nun die schlechte Nachricht: nur da und zwar ab der Version 5.5.
Diese neuen Designmöglichkeiten sind nicht auf einem w3c Standard gewachsen, also erwarten sie nicht, daß dies von Netscape unterstützt werden. Gerüchten zufolge zieht sich Netscape nun auch endgültig vom Browsermarkt zurück...
Kommen wir zu den Scrollbars.
Farbige Scrollbars sind als CSS Anweiszung unterzubringen. Unterstützt eine Browser diese Tags nicht, werden sie einfach übergangen. Dazu gibt es folgende Möglichkeiten:
scrollbar-3dlight-color 3-D Kanten
scrollbar-arrow-color Scrollbar Pfeil
scrollbar-base-color Grundfarbe
scrollbar-darkshadow-color Kantenschatten
scrollbar-face-color Grundfarbe ohne Kanten
scrollbar-highlight-color Farbige "Beleuchtung"
scrollbar-shadow-color Kantenschatten (Kantenschatten) |
Testen Sie mal die Möglichkeiten und deren Auswirkungen. Aber wie...?
Die Tags müssen in einem Cascade Styleshett angegeben sein:
(Die Werte für die Farben können wie üblich in Hex oder per Name angeben.)
z.B:
BODY {
scrollbar-base-color: #00ff00;
scrollbar-face-color: #ffff00;
} |
Das gesamte Beisiel sieht dann so aus:
CSS intern
<html>
<head>
<title>Scrollbars mit neuen IE 5.5 Funktionen</title>
<style type="text/css">
<!--
BODY {
scrollbar-base-color: #00ff00;
scrollbar-face-color: #ffff00;
}
;
.sbars {
scrollbar-3d-light-color: #ddffee;
scrollbar-arrow-color: black;
scrollbar-base-color: orange;
scrollbar-darkshadow-color: blue;
scrollbar-face-color: orange;
scrollbar-highlight-color:#aaffbb;
scrollbar-shadow-color:#eeffee;
}
-->
</style>
</head>
<body> Ne Beispiel Seite:
<iframe height=300 width=800 src="http://www.devtrain.de" name="iframe2">DEVTRAIN</iframe>
<br>
<br> Oder auch in einer Textarea möglich:
<textarea cols="60" rows="5" wrap="off" class="sbars">
Schreiben Sie hier den gewünschten Text rein. Schreiben Sie hier den gewünschten Text rein. Schreiben Sie hier den gewünschten Text rein.
</textarea> </body>
</html> |
Das wars!
Eigenes URL ICON
Besonders gelungen finde ich aber die Möglichkeit ein kleines Icon in der URL zu verewigen. Dieses Icon taucht nicht nur in der Adresszeile auf, sondern auch in den Favoriten oder in der Linkleiste.
Zunächst braucht man ein Programm mit dem das kleine Icon erstellen kann. Gespreichert wird dieses Bitmap als *.ico. Die Größe darf entweder 16x16 oder 32x32 Pixel groß sein.
Wenn man das geschafft hat, muß man das in die Seite folgendermassen einbinden:
| <LINK REL="MEIN ICON" HREF="die URL zu ihrem ICON"> |
Beispiel: