unsichtbare Schaltfläche
Mit einer transparenten Grafik können sie einen unsichtbaren Link in ihre Seite einbauen. Na, über den Verwendungszweck oder den praktischen Nutzen können sie lächeln oder schaffen mit dieser Option eine unvorhergesehene Überraschung.
|
|
Link über einer transparenten Grafik (unsichtbar)
Sie könnten ebenso ein 'unsichtbares Bild' sichtbar machen Beispiel 
Wieder mal ist eine transparente Grafik (transpixel.gif) zur Anwendung gekommen.
Beispiel
Hier ein Auszug aus einer älteren Startseite. Die angezeigten Grafiken dienen normalerweise als Verweis für den Aufruf anderer HTML-Seiten (hier ohne Funktion). Außer den sichtbaren Grafiken gibt es (links daneben) ein unsichtbares Image als Verweis (transpixel.gif). Das wird nur offensichtlich, bewegt man die Maus über die Fläche der Grafik.
zum Download die transparente Grafik rechts-klicken. Dateiname: transpixel.gif Größe: 1 x 1 Pixel
Bei der Einbindung "lügen" Sie bei den Größenangaben und die Mini-Grafik wird 'gesteckt'.
<a href="dateiname.htm">
<img src="transpixel.gif" width="50" height="50" border="0" alt="">
</a>
Curser-Style
Wenn sie den Link nur eingeweihten Besuchern sichtbar machen möchten, bleibt außerdem noch die Möglichkeit die Änderung des Cursers beim Überfahren mit dem Mauszeiger zu unterdrücken.
Mit CSS legen sie für diesen Link den Mauszeigertyp "normal" fest. Die übliche Hand, die für den Mauszeiger über Verweisen erscheint, ist dann nicht zu sehen.
Statt cursor: pointer; cursor: default;
CSS-Code im Head-Bereich der HTML-Datei:
<style type="text/css">
<!--
.invisible:hover {
cursor: default;
}
-->
</style>
CSS-Klasse im Link als Attribut einsetzen:
<a class="invisible" href="dateiname.htm">
<img src="transpixel.gif" width="50" height="50" border="0" alt="">
</a>
Mauszeiger Testen
 | üblicher Mauszeiger für einen Link <a href="#"> |

|
'getarnter' Mauszeiger für den Link <a class="invisible" href="#"> |

Hintergrundfarbe ändern - dadurch wird eine Grafik sichtbar
Texte ein- und ausblenden

|