Die folgenden Kommentarteile können gelöscht werden, wobei man doch bitte die obige Copyrightzeile belassen möchte.

	Warum *noch* eine weitere MouseOver-Routine?

Die meisten mir bekannten MouseOver-Routinen im Web sind sehr aufgebläht, weil sie Dinge tun, die schlichtweg unnötig, teilweise sogar sinnlos, schlimmstenfalls sogar fehlerhaft sind, also versuchte ich, eigene zu entwickeln. Ein Dank hierbei an Carsten Bluck von www.bigs.de, dessen harmlose Anfrage wegen solcher Routinen meine eigenen Versuche erst lostrat und meinen Ergeiz anstachelte. :-)

Diese Routinen hier sollten die kleinsten und am leichtesten zu bediendenen Routinen sein, die mir derzeit im WEB bekannt sind. Trotzdem sollen sie hier erläutert werden:

	Wie funktionieren sie?  (nur für Javascript-Programmierer interessant)

Gut! :-) Zunächst wird im globalen Teil geprüft, ob der Browser das Objekt 'document.images' überhaupt kennt und dies Objekt wird dann in der Variablen 'di' gespeichert, damit es später in den Aufrufen <a ...> direkt benutzt werden kann. Die ganzen Browser-Versionsabfragenorgien, die man sonst so sieht, haben sich mit der einen Anweisung 'if(document.images)' erledigt. Kennt der Browser 'document.images' nicht, dann wird id="" leer definiert, damit die Abfragen später in mV() und mO() trotzdem sauber funktionieren und auch in den späteren <a ...>-Aufrufen 'di.Name' existiert und damit verwendet werden darf.

Nun kann in der Variablen 'pf' ein Pfad definiert werden, in welchem sich die Grafiken befinden. Damit können alle Dateinamen *in den Script-Bereichen(!)* ohne diesen Pfad angegegeben werden. Man erspart sich viel Tipperei, reduziert damit die Fehlerträchtigkeit und könnte z. B. auch einen "Umzug" der Grafiken von "Images/" nach "IMAGES/" oder nach "IMGs/" oder nach "" viel schneller realisieren. Braucht man keinen Pfad, könnte man auch alle Anweisungen, die '+pf' enthalten, komplett löschen, wenn man will. Achtung: in den IMG-Tags MUSS der Pfad bei SRC= trotzdem angegeben werden, da dies kein Script-Code ist und dort pf nicht vorhanden ist!

Jetzt wird schonmal das Laden der MouseOver-Images angeworfen, in dem mit vl() einfach HTML-Code erzeugt wird, der die Grafiken mit Breite und Höhe 1 auf dem Bildschirm anzeigt. Gibt man irgendwo 0 an, lädt Netscape sie nicht, daher beides mit 1. Es kann sein, daß es Browser gibt, welche den hier erzeugten IMG-Code nicht beachten, wenn die vl()-Aufrufe im HEAD-Teil liegen, daher sollte man die vl()-Aufrufe in den Body-Teil legen (wie hier). Trotzdem wird von einigen Browsern (z. B. Netscape) an dem Platz der Grafiken eine komplett neue Zeile genieriert. Man sollte den Script-Teil vor dem letzten Ende-Tag setzten, den die Seite hat: Beispiel:
<h2>Ende der Seite<h2><script>vl("LoGo.gif")</script>    schlecht
<h2>Ende der Seite<script>vl("LoGo.gif")</script><h2>    besser

Nun zu den Kernroutinen für MouseOut 'mO() und MouseOver 'mV()'. 

Grundsätzlich gibt es ja zwei Möglichkeiten, um den Dateinamen einer Grafik zu referenzieren:
 document.images(4).src   - der Index der Grafik (hier z. B. das 5. Bild in einer Seite)
 document.images.LoGo.src - der Namen der Grafik (hier z. B. mit NAME="LoGo" im IMG-Tag)

Die erste Variante benötigt zwar keine Namenszuweisung im entsprechenden IMG-Tag, ist aber ein wenig dumm, weil man bei jeder Änderung der HTML-Datei die Richtigkeit der Indizes erneut überprüfen und ggf. mitändern muß. Außerdem könnten vor den MouseOver-Aufrufen andere Grafiken zu Laufzeit scriptgesteuert mal angezeigt und mal nicht angezeigt werden, was ja den Index einer jeden weiteren auf der Seite folgenden Grafiken (und damit evtl. die betroffenen MouseOver-Grafiken) verändern würde. Also machen wir es doch lieber über den Namen.

Die Routine mO() ist für die MouseoOut-Aufrufe und die mV() für MouseOver zuständig (mO( wegen dem 'o' von 'Out' und 'v' wegen 'oVer'. Ein MouseOut-Event kann niemals ausgelöst werden, ohne daß es vorher einen MouseOver gab. Das machen wir uns zunutze. In mV() retten wir uns erst den aktuellen Objektnamen (z. B. 'Fritz') in die globale Variable 'nam' und den Dateinamen in 'dat' (auch global). Dann wird die Grafik mit dem übergebenen Dateinamen ersetzt. Kommt jetzt als nächstes wieder ein MouseOut - und das muß ja so sein - dann wird in mO() mit den geretteten Daten der Variablen nam und dat die vorher mit MouseOver veränderte Grafik wiederhergestellt. Aus diesem Grund wird mO() auch ohne Parameter aufgerufen, was den Komfort des Einbaues in die <a ...>-Aufrufe *gewaltig* vereinfacht und nicht mehr zu Fehlern führen kann (in anderen Routinen muß man meist die MouseOver- *und* in 'OnMouseOut=' nochmal die Original-Datei angeben)

	Wie werden sie genutzt? (für alle User interessant)

Alle Bilder, welche man mit MouseOver austauschen möchte, müssen bei <IMG SRC=...> Namen bekommen, die sie eindeutig identifizieren. Nehmen wir als Beispiel die Zeile der Logo-Grafik:

<a href=index.htm OnMouseOver="mV(di.LoGo,'hauptlogo-o.gif')" OnMouseOut="mO()"><img src=hauptlogo.gif border=0 NAME="LoGo"></a>

1.) Auch wenn man mit der Grafik gar kein anklickbaren Link erzeugen will, muß man es trotzdem, denn Netscape beachtet nur im <a ...>-Tag Optionen wie MouseOver="" und MouseOut="".

2.) Der Objekt-Name der Grafik lautet "LoGo" und hier muß, wie beim Dateinamen, die Groß-/kleinschreibung beachtet werden. Er wird mit <img ... name="LoGo"> definiert und *sollte* dort in Anführungszeichen angegeben werden. Er wird dann innerhalb des <a ...>-Tags z. B. mit     OnMouseOver="mV(di.LoGo,'hauptlogo-o.gif')"   *benutzt*! Wichtig ist hierbei, daß dort der Ausdruck di.LoGo *AUF GAR KEINEN FALL* in einfachen Anführungszeichen stehen DARF, während der Dateiname 'hauptlogo-o.gif' *UNBEDINGT* in diesen einfachen Anführungszeichen stehen MUSS!! (di.LoGo ist eine Variable, welche Infos *enthält*, während 'hauptlogo-o.gif' bereits die Info selbst als ein konstanter String *ist*)

Der Objekt-Name hat nichts mit dem Dateinamen zu tun und unterliegt auch stärkeren Beschränkungen:

- darf keine Umlaute, Sonderzeichen und Zeichen wie +-,. etc. enthalten. Ausnahme: "_" (Unterstrich).
  Man sollte daher nur "a" bis "z", "A" bis "Z", "0" bis "9" und "_" verwenden.
- darf nicht mit einer Ziffer oder dem Unterstrich *beginnen*!

3.) Weitere <IMG ...>-Tags, die möglicherweise die gleichen Grafiken zeigen, aber nicht mit MouseOver wechseln, dürfen keine Namensgebung mit NAME="LoGo" mehr haben. Sollen die gleichen Grafiken an anderer Stelle erneut MouseOver erhalten, müssen *dort andere* Objekt-Namen vergeben werden, damit sie *dort* auch wechseln. Was wie passiert, wenn man dies und jenes definiert, sieht man in den Beispielen.