Dokumentation
Der Quellcode des Designs ist ausführlich kommentiert, so dass hier nur auf einige Besnderheiten hingewiesen wird.
Designaufbau
Die Grundstruktur des Designs besteht aus Tabellen in Verbindung om div-Layern. Die Formatanweisungen sind nahezu vollständig in eine CSS-Datei ausgelagert
Navigation
Für jeden Menüpunkt werden 2 Grafiken benötigt. Der Rollovereffekt wird mit einem JScript erreicht. Es ist empfehlenswert, die jeweils zusammengehörenden Grafiken etwas ähnlich zu gestalten.
Scripteinbindung
<script language="JavaScript" src="javascript/JSFX_FadingRollovers.js" type="text/javascript">
</script>
Das Script muss initialisiert werden.
Scriptinitialisierung
<script language="JavaScript">
<!--
JSFX.Ro("start", "buttons2_start_over.gif");
JSFX.Ro("doku", "buttons2_doku_over.gif");
JSFX.Ro("galerie", "buttons2_galerie_over.gif");
JSFX.Ro("radio", "buttons2_start_over.gif");
JSFX.Ro("video", "buttons2_start_over.gif");
//-->
</script>
Jeder Menüpunkt wird mit einem eindeutigen Bezeichner gefolgt von der URL zur Grafik, die beim Rollover erscheinen soll, initialisiert.
Der Bezeichner wird dann in den einzelen Menüpunkten, die in eine Tabelle eingelagert sind, wieder verwendet.
Ein Menüpunkt
<td background="buttons2_start.gif">
<a href="#" onmouseover="JSFX.fadeIn('contact')" onmouseout="JSFX.fadeOut('contact')">
<img name="contact" class="Fader" src="buttons2_start.gif" border="0"></a></td>
Newsleiste
Die Newsleiste besteht aus einem iframe, mit dem eine gesondert gestaltete Textseite angezeigt wird.