Komplexe Flash-Navigationsleiste für HTML-Sites

Letzte Arbeiten

  Aufbau des HTML-Framesets
  Einbinden der HTML-Aufrufe
  Einbinden der Flash-Navigation




Aufbau des HTML-Framesets

Das Frameset der Website, die wir bauen, besteht aus 2 vertikalen Frames. Im Linken soll sich die Navigation befinden und im Rechten werden die Seiten aufgerufen. Es ist also wichtig, die Frames zu benennen. In dem Beispiel nennen wir den rechten Frame "content", den linken Frame "nav" (der Vollständigkeit halber).
Das Frameset sieht dann so aus:

<Frameset cols="170,*" frameborder="NO" border="0" framespacing="0"> 
	<Frame src="nav.html" name="nav" scrolling="NO" noresize frameborder="NO" marginwidth="0" marginheight="0">
<Frame src="home.html" name="content" frameborder="NO" marginwidth="0" marginheight="0">
</Frameset>

Der Frame für die Navigation wird auf 170 Pixel Breite definiert, was der Breite des Navigationsmovies entspricht. Der content-Frame bleibt in der Breite variabel. Scrollbalken deaktivieren wir.
Die einzelnen HTML-Seiten der Website sollten jetzt auch soweit vorbereitet werden, damit zumindest die Filenamen klar sind.




Einbinden der HTML-Aufrufe

Abb.12: Einbinden der "Get URL"-Action
Abb.12: Einbinden der "Get URL"-Action

Wie angekündigt, hinterlegen wir die URL-Aufrufe bei den Keyframes der einzelnen Button-Stati innerhalb der Timeline. Dadurch wird erst die Navigation animiert und am Ende die neue Seite aufgerufen.
Die Action "Get URL" wird in jedem Keyframe eingefügt, wobei wir im Feld "Window" den Namen des Zielframes angeben (in unserem Fall "content"). Das wars dann auch schon.

Um zu testen, ob alle URL-Aufrufe richtig funktionieren, gehen wir wieder in den Testmodus des Movies (Strg+ENTER) und öffnen dort das Fenster "Output". In diesem Fenster läßt sich wunderbar verfolgen, welche Informationen/Aufrufe vom Flash-Movie aus erfolgen.

 




Einbinden der Flash-Navigation

An dieser Stelle möchte ich nur auf ein entsprechendes Tutorial verweisen ("Randlos glücklich"), in dem das Einbinden von Flash-Movies in HTML-Seiten ohne Rand prima und ausführlich beschrieben ist.

OK - das wars. Ich hoffe, daß ich mich verständlich genug ausgedrückt habe und ihr vielleicht das eine oder andere gelernt habt.

Um die fertige Beispiel-Website zu sehen, einfach hier klicken.



 

Zurück