Startseite mit mehreren Bereich inkl. Navigation

[Anastasia W.]

Sehr geehrte Damen und Herren,

vielleicht können Sie mir weiterhelfen. Ich benötige für meine Homepage drei Unterseiten welche Wiederrum jeweils 2-3 Bereiche haben:

• Startseite

  • Kontakt
  • Bilder
  • Leistungen

• Über mich

  • Beschreibung
  • Bild
  • Referenzen

• Impressum

  • Inhalt
  • Kontaktformular
  • Googlemap

Folgende Design schwebt mir im Kopf. Wenn die Startseite aufgerufen wird soll ein großes Bild zu sehen sein welches über die ganze Seite geht. Unten am Bildschirmrand sollte sich meine Navigation befinden. Scrollt der User nach unten sollte die Navigation mit dem großen Bild mitwandern, allerdings irgendwann ganz oben stehen bleiben, sobald man in den zweiten Bereich der Startseite gelangt. Scrollt der User wieder nach unten sollte die Navigation wenn der User im ersten Bereich mit dem großen Bild angekommen ist wieder mit nach unten wandern.

Was ich im Internet zusammen gesucht / gefunden habe wäre diese Aufbau.

<section>

	<div>Hier kommt ein Text für Google rein, der über das Bild gelegt wird</div>
	
	<nav>
	<img src="" alt="Logo">
	<ul>
		<li><a href="#">Startseite</a></li>
		<li><a href="#">Über mich</a></li>
		<li><a href="#">Impressum</a></li>
	</ul>
	</nav>

</section>

<section>
	<h2>Kontakt</h2>
	<p>Hier kommt eine kleine Beschreibung rein</p>
</section>

<section>
	<h2>Bilder</h2>
	<p>Hier kommt eine kleine Beschreibung rein</p>
</section>

<section>
	<h2>Leistungen</h2>
	<p>Hier kommt eine kleine Beschreibung rein</p>
</section>

Wie kann ich es erreichen dass ich mehrere Bereiche habe, die immer komplett den ganzen Bildschirm ausfüllen. Benötige ich JavaScript?