From d2765802f40f679e6a815838851f0507ac04a25c Mon Sep 17 00:00:00 2001
From: seli <selina.schoenherr@gmx.de>
Date: Sun, 4 Nov 2018 16:28:43 +0100
Subject: [PATCH] =?UTF-8?q?Mobil-Men=C3=BC=20(section=20r=C3=BCckt=20nach?=
 =?UTF-8?q?=20unten)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 index.html  |  6 ++++--
 js/table.js | 15 ++++++++++++++-
 2 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/index.html b/index.html
index 8aa2ce7..be521a7 100644
--- a/index.html
+++ b/index.html
@@ -48,7 +48,9 @@
         </div>
     </nav>
 
-    <div class="page">
+
+
+    <section class="page" id="section">
         <h1>World Data Overview ...</h1>
 
         <p class='text'>Li Europan lingues es membres del sam familie. Lor separat existentie es un myth. Por scientie,
@@ -77,7 +79,7 @@
         </div>
 
 
-    </div>
+    </section>
     <div class="page">
         <footer class="footer">
             <div class="foo-left">
diff --git a/js/table.js b/js/table.js
index 04f5db6..982f06f 100644
--- a/js/table.js
+++ b/js/table.js
@@ -268,7 +268,20 @@ function div_change(strID) {
 }
 
 function registerHamburgerToggleClickListener() {
+    let menu = document.querySelector("#menu");
+    let section = document.querySelector("#section");
     document.querySelector("#hamburger-toggle").addEventListener('click', function () {
-       document.querySelector("#menu").classList.toggle('active');
+        if (menu.classList.contains('active')) {
+            // menu ausblenden
+            document.querySelector("#menu").classList.remove('active');
+            section.style.marginTop = 0;
+        } else {
+            // menu einblenden
+            document.querySelector("#menu").classList.add('active');
+            let height = menu.clientHeight;
+            section.style.marginTop = height + 10 + 'px'; // + 10 für zusätzlichen abstand (klebt sonst aneinander)
+        }
+
+
     });
 }
\ No newline at end of file