up

2017-03-21 14:41:49 +03:00 · 2017-03-21 14:41:49 +03:00 · ab9ab64bd5
commit ab9ab64bd5
parent 4ae129054e
476 changed files with 3370 additions and 532 deletions
--- a/2-ui/2-events/01-introduction-browser-events/05-sliding-menu/solution.view/index.html
+++ b/2-ui/2-events/01-introduction-browser-events/05-sliding-menu/solution.view/index.html
@ -0,0 +1,57 @@
+<!DOCTYPE HTML>
+<html>
+
+<head>
+  <meta charset="utf-8">
+  <style>
+    .menu ul {
+      margin: 0;
+      list-style: none;
+      padding-left: 20px;
+      display: none;
+    }
+
+    .menu .title {
+      font-size: 18px;
+      cursor: pointer;
+    }
+
+    .menu .title::before {
+      content: '▶ ';
+      font-size: 80%;
+      color: green;
+    }
+
+    .menu.open .title::before {
+      content: '▼ ';
+    }
+
+    .menu.open ul {
+      display: block;
+    }
+  </style>
+</head>
+
+<body>
+
+  <div id="sweeties" class="menu">
+    <span class="title">Sweeties (click me)!</span>
+    <ul>
+      <li>Cake</li>
+      <li>Donut</li>
+      <li>Honey</li>
+    </ul>
+
+  </div>
+
+  <script>
+    let menuElem = document.getElementById('sweeties');
+    let titleElem = menuElem.querySelector('.title');
+
+    titleElem.onclick = function() {
+      menuElem.classList.toggle('open');
+    };
+  </script>
+
+</body>
+</html>