header_nav.html 1.1 KB

12345678910111213141516171819202122232425262728293031323334
  1. <div id="header_nav">
  2. <div class="navSlideout">
  3. <i class="menuExpand" id="header_nav_expander"><span></span><span></span><span></span></i>
  4. </div>
  5. <nav class="slidingNav">
  6. <ul>
  7. {% for item in site.data.nav %}
  8. <li class="navItem">
  9. {% if item.category == "external" %}
  10. <a href="{{ item.href }}" target="_blank">{{ item.title }}</a>
  11. {% else %}
  12. <a href="{{ item.href | relative_url }}">{{ item.title }}</a>
  13. {% endif %}
  14. </li>
  15. {% endfor %}
  16. {% if site.searchconfig %}
  17. {% include nav_search.html inputselector="search_input_react" %}
  18. {% endif %}
  19. </ul>
  20. </nav>
  21. </div>
  22. <script>
  23. var event = document.createEvent('Event');
  24. event.initEvent('slide', true, true);
  25. document.addEventListener('slide', function (e) {
  26. document.body.classList.toggle('sliderActive');
  27. }, false);
  28. var headerNav = document.getElementById('header_nav');
  29. var headerNavExpander = document.getElementById('header_nav_expander');
  30. headerNavExpander.addEventListener('click', function(e) {
  31. headerNav.classList.toggle('navSlideoutActive');
  32. document.dispatchEvent(event);
  33. }, false);
  34. </script>