Eigentlich ist es fast schon Standard im Internet: Hyperlinks sehen nicht nur anders aus, als der Rest der Seite, wenn ich mit der Maus drüberfahre, verändern sie sich auch. Im Regelfall sind die Hyperlinks dann hübsche kleine Bildchen - selbst wenn sie aus reinem Text bestehen. Der Grund ist einfach: Dafür gibt es Scripte, mit denen funktioniert es in allen Browsern.

Anders sieht es bei echtem Text aus. Wer wegen der geringeren Dateigröße keine Pixel durchs Netz schicken möchte, erreicht entweder die Hälfte der Welt nicht oder muß herbe Einschränkungen hinnehmen.

Cascaded Style Sheets

Bei Verwendung von Cascaded Style Sheets (CSS) ist es ein ganz einfacher Befehl - der auch von diesen Seiten genutzt wird:

A { font-family: arial, verdana, Helvetica; color: #008000; text-decoration: none; cursor: hand; font-weight: bold}

A:hover { font-family: arial, verdana, Helvetica; color: "#FF0000"; text-decoration: none; cursor: hand}

Alle A-Tags (also die Hyperlinks) werden damit auf fette, grüne Schrift gesetzt, die Unterstreichung wird unterbunden. Wenn die Maus über den Link fährt, färbt er sich eventuell rot, wenn er nämlich in einem Internet Explorer dargestellt wird. In den CSS-Implementationsrichtlinien, an denen Microsoft und Netscape mitgearbeitet haben, wurde es den Programmierern nämlich freigestellt, ob sie Mouse-Over integrieren. Netscape "vergaß" es. Trotzdem: Dies ist die Methode, für die wir uns auf diesen Seiten entschieden.

• Weitere Informationen: Webreference
• Siehe auch |- Tips und Tricks | CSS in Netscape -| : funktionslos bei abgeschaltetem JavaScript.

JavaScript mit Mouse-Over-Event

Theoretisch ist es ganz einfach sein, in einem A-Tag (also in der Hyperlink-Definition) einen Mouse-Over- und Mouse-Out-Event zu definieren, die eine Funktion aufrufen, die z.B. die Farbe des Hyperlinks ändert. Praktisch funktioniert das im Internet Explorer, aber nicht im Netscape-Browser. Letzterer aktualisiert einfach zur Laufzeit nicht das Layout. Also keine Verbesserung gegenüber CSS, dafür mehr Aufwand.

<Span>-Tag und JavaScript

Ein anderer Ansatz ist der Span-Tag, bei dem innerhalb des Span-Bereichs "zur Laufzeit" von JavaScript Code samt Text ausgetauscht wird. Während der "einfache" Mouse-Over-Event im Netscape-Browser nicht funktioniert, mit <Span> geht es. Dabei kann sogar der anzuzeigende Text noch wechseln. Aber es funktioniert nur mit erheblichen Nachteilen: Da der <Span> als relativer Span definiert werden muß, werden die vom <Span>-Tag umfaßten Texte von den Browsern nicht richtig berechnet. Dementsprechend können die Links nur am Ende einer Zeile und nur einzeilig in die Seite integriert werden (ohne Zeilenumbruch!). Andernfalls wird das Layout nicht mehr vorhersehbar. (Erneut ist der Netscape-Browser miserabler in der Implementation als der Internet Explorer.)

Beispiel für eine Link-Definition mit <span> in HTML:

<p><small><span ID="Test" STYLE="position: relative"><a CLASS="item"
HREF="http://www.transcom.de"
onMouseOver="swapClass('Ja, ich will zur Testseite', 'Test', this.href, 'item', 'highlight', true)"
target="_blank">Testseite</a></span></small></p>

Weitere Informationen: Webreference

<ilayer>-Tag und JavaScript

Der <ilayer>-Tag ist erst in JavaScript 1.2 (ab Netscape Communicator 4) implementiert. Ältere Browser hätten also nichts davon. Außerdem funktioniert der <ilayer> auch wieder nur bei einzeiligen Hyperlinks: Bei Zeilenumbrüchen im Link-Text hätte die Funktion keine Chance mehr, die Layer-Grenzen sauber zu bestimmen. Nur einzeilige Texte sind aber genau da, wo Mouse-Over-Effekte am interessantesten sind (in der meist schmalen Navigationsspalte einer Seite) oftmals inakzeptabel.

Weitere Informationen: Inside DHTML

---

InvitationWare

• Invitation (Englisch): Einladung
• Invitation for tender: Ausschreibung

Die Informationen auf www.transcom.de sind InvitationWare: Einerseits sind Sie eingeladen, sie zu nutzen. Andererseits, wenn die Informationen auf diesen Seiten Ihnen geholfen haben oder die Tipps und Programme für Sie nützlich sind, dann erinnern Sie sich doch an Transcom, wenn Sie mal wieder einen Auftrag in einem unserer Fachgebiete zu vergeben haben — und senden uns eine Einladung zum Angebot. Rufen Sie uns an oder senden uns eine E-Mail.