Glasartige Navigation (Fortgeschritten)

Navigationen in FW sind einfach zu realisieren. Fireworks bietet dafür eigene Funktionen, die es erlauben aus einem beliebigen Objekt einen Button zu machen. Der erste Schritt allerdings ist auch 3 identische Buttons zu erstellen, einen für Normal, einen für MouseOver und einen für Active. Natürlich könnt Ihr auch aus nur einem Objekt einen Button erstellen, allerdings bleiben dann jegliche Effekte weg. Bei mir sehen die 3 Buttons so aus:



Es ist wichtig, daß die 3 Objekte GENAU gleich gross sind, da sich das ganze verschiebt, wenn der Over Button grösser ist, wenn ich mit der Maus über den Button fahre. Nun zum erstellen der Navi:

1. Schritt: den Button "Over" kopieren (Control+C) den Button "Normal" anklicken und F8 drücken. FW hat nun ein Slice über das Objekt gelegt(grün) und es als Button deklariert.

Macht einen Doppelklick auf den grünen Bereich, danach wird dieses Feld erscheinen:



Hier den Namen des Buttons angeben, und bei den Radio-Buttons "Schaltfläche" auswählen! Auf Ok drücken und dann werdet ihr im Dialog der Menüerstellung sein. Wie ihr seht hat FW den "Normal" Button schon bei "Up" hinzugefügt, daran müssen wir also nichts mehr ändern. Wir switchen im Menü Oben auf "Over" und fügen dort mit Control+V den Button wieder ein, den wir vorher kopiert haben:



WICHTIG: Die Buttons müssen am genau gleichen Ort sein. Wenn ihr den Button markiert, könnt ihr anhand der >Koordinaten (ganz links unten im FW Fenster) die Position der beiden Buttons überprüfen. Over beschreibt wie gesagt den Status, wenn die Maus über dem Button ist. Wir switchen nun im Menü oben auf "Unten". Dies beschreibt den Status, wenn der Button gedrückt wird. (kurz auf Fertig klicken, den Active Button kopieren, Doppelklick auf den grünen Bereich und auf Unten switchen)
Bei Unten fügen wir den letzten der 3 Buttons hinzu:



Nochmals die Position überprüfen und auf Fertig klicken.

So, der Hauptteil wäre gemacht. Jetzt können die beiden Buttons "Over" und "Active", die sich noch auf der Arbeitsfläche befinden, gelöscht werden, da sie sich im Button befinden! Wenn Ihr euren Button anklickt, könnt ihr links unten noch die Eigenschaften des Links einstellen:



Hyperlink, Alt-Text, Link-Text, alles ist noch einstellbar =)

Fireworks eignet sich durchaus auch für anspruchsvolle Navis!

Wer noch ein wenig basteln will, aber zu faul ist sich selber eine Navi zu erstellen, kann mir ne PM schreiben, dann schicke ich die PNG Datei dieser Navigation

Greez: Gorbatschow