scripts.js

   1 document.addEventListener("DOMContentLoaded", function() {
   2
   3     // Add JS class
   4     document.querySelector('body').classList.add('js');
   5
   6     // Create the dropdown base
   7     var select = document.createElement("select");
   8
   9     // Create default option "Go to..."
  10     var opt = document.createElement("option")
  11     opt.setAttribute("selected", "selected")
  12     opt.setAttribute("value", "")
  13     opt.innerHTML = "Aller à ...";
  14     select.appendChild(opt);
  15
  16     // Populate dropdown with menu items
  17     [].forEach.call(document.querySelectorAll('nav.menu a'), function(el) {
  18         var opt = document.createElement("option");
  19         opt.setAttribute("value", el.href)
  20         opt.innerHTML = el.text;
  21         select.appendChild(opt);
  22     });
  23
  24     // To make dropdown actually work
  25     // To make more unobtrusive: http://css-tricks.com/4064-unobtrusive-page-changer/
  26     select.addEventListener('change', function(el) {
  27       window.location = select.value
  28     });
  29
  30     // Add select to menuWrapper
  31     document.querySelectorAll('nav.menu')[0].appendChild(select);
  32 });