JavaScript - Mobile Navigation

Nutzen Sie als Basis das Markup und die Styles aus der letzten Übung.

Step 1

Kopieren Sie die CSS Dateien aus dem Gist. in ihr Projekt und binden Sie diese in der Datei biography-lucas-cranach.html ein.

Ergänzen Sie außerdem die biography-lucas-cranach.html um den Inhalt der header.html aus dem Gist.

Step 2

Erzeugen Sie einen scripts Ordner in ihrem Projekt und darin eine Datei main.js.

Binden Sie anschließend die JavaScript Datei in ihre index.html ein.

Step 3

Erstellen Sie in der main.js JavaScript-Code, der folgende Funktionalität ermöglicht:

• Bei Betätigung des Hamburger-Buttons soll das Overlay mit der Hauptnavigation eingeblendet werden.
• Bei Betätigung des „X”-Buttons soll das Overlay wieder geschlossen werden.