Difference between revisions of "Template:Northwestern Page Head"
| Line 517: | Line 517: | ||
--> | --> | ||
| + | <script> | ||
| + | (function(){ | ||
| + | var button = document.getElementById('cn-button'), | ||
| + | wrapper = document.getElementById('cn-wrapper'), | ||
| + | overlay = document.getElementById('cn-overlay'); | ||
| + | |||
| + | //open and close menu when the button is clicked | ||
| + | var open = false; | ||
| + | button.addEventListener('click', handler, false); | ||
| + | button.addEventListener('focus', handler, false); | ||
| + | wrapper.addEventListener('click', cnhandle, false); | ||
| + | |||
| + | function cnhandle(e){ | ||
| + | e.stopPropagation(); | ||
| + | } | ||
| + | |||
| + | function handler(e){ | ||
| + | if (!e) var e = window.event; | ||
| + | e.stopPropagation();//so that it doesn't trigger click event on document | ||
| + | |||
| + | if(!open){ | ||
| + | openNav(); | ||
| + | } | ||
| + | else{ | ||
| + | closeNav(); | ||
| + | } | ||
| + | } | ||
| + | function openNav(){ | ||
| + | open = true; | ||
| + | button.innerHTML = "-"; | ||
| + | classie.add(overlay, 'on-overlay'); | ||
| + | classie.add(wrapper, 'opened-nav'); | ||
| + | } | ||
| + | function closeNav(){ | ||
| + | open = false; | ||
| + | button.innerHTML = "+"; | ||
| + | classie.remove(overlay, 'on-overlay'); | ||
| + | classie.remove(wrapper, 'opened-nav'); | ||
| + | } | ||
| + | document.addEventListener('click', closeNav); | ||
| + | |||
| + | })(); | ||
| + | </script> | ||
</body> | </body> | ||
</html> | </html> | ||
Revision as of 20:59, 21 July 2017
