|
|
Einige Seiten verwenden nette Effekte, etwa beim Seitenübergang von Dokumenten oder zur Verfremdung von Grafiken.
Dabei handelt es sich um proprietäre Tags, welche nicht zum CSS-Standard gehören.
Zum Einen lässt sich mit diesen Filtern die Transparenz von Seitenelementen definieren.
Je nach Browser unterscheidet sich die entsprechende Syntax:
| Browser | Eigenschaft | mögliche Werte | Wirkung |
| Netscape ab Version 6,Mozilla | -moz-opacity | 0-1 | 0->100%Transparenz
1->keine Transparenz |
| Internet-Explorer ab Version 4 | filter:Alpha() | opacity:0-100 | 0->100%Transparenz
100->keine Transparenz |
Beispiel:
transparente Grafik mit CSS-Filter
Quelltext:
 |
|
|
|
<html>
<head>
<title>Opacity</title>
</head>
<body style="BACKGROUND-COLOR:#003858;">
<img src="../images/logo.gif"style="-moz-opacity:0.2;filter:Alpha(opacity=20)"></a>
</body>
</html>
|
|
|
|
|
Erläuterung:
Die Seite enthält eine Grafik, deren Transparenz über den CSS-Filter auf 80% gesetzt wurde.
Es handelt sich dabei um die selbe Grafik, die hier als Logo Verwendung findet, durch die Filter erscheint Sie jedoch transparent(sofern der verwendete Browser dazu in der Lage ist).
Notiert wurden dabei beide Varianten aus obiger Liste, um den Effekt sowohl bei Netscape/Mozilla, als auch beim Internet-Explorer zu erreichen. Bei anderen Browsern zeigt die Angabe keine Wirkung.
Der Internet-Explorer beherrscht neben der Alpha-Transparenz noch eine Vielzahl weiterer Filter und Effekte, welche sich mittels Javascript auch dynamisch ändern lassen.
Mehr Informationen dazu findest du unter:
|
|
|
|
 |
In Netscape/Mozilla kann das verwenden dieser Filter, insbesondere das dynamische Ändern der Werte, zum Browsercrash führen.
|
|
|
|
|
|
|
|
