Nav

Nav = function(configObject) {

    var targetJq = $(configObject.targetSelector);
    var liJq = targetJq.find("ul:first > li");

    var overlay = $("<div id='underlay'></div>");
    targetJq.after(overlay);
    overlay.css("display", "none");
    var navItemArray = [];
    var li = liJq[0];

    liJq.each(function(i){

      $(this).addClass("shade--" + i);
      var $dropdown = $(this).find("ul:first");
      var spanJq = $(this).find("span:last").eq(0);

      $(this).hover(function (){
        raiseSpan($(this), spanJq)
      , function(){
        lowerSpan($(this), spanJq);
      });

      //more sensitve for dropdowns
      var hoverConfig = {
          sensitivity: 3,
          interval: 100,
          timeout: 250,
          over: function(){
            darken();
            showDropdown($dropdown);
          },
          out: function(){
            undarken();
            hideDropdown($dropdown);
          }
      };

      if ($(this).find('ul').length > 0) $(this).find('ul').hoverIntent(hoverConfig);

    });

    function raiseSpan(liJq, spanJq) {
        if (!liJq.hasClass("current")) { // stops bar jumping
            spanJq.stop().css("top", "-5px");
        }
    }

    function lowerSpan (liJq,spanJq) {
        if (!liJq.hasClass("current")) {
            spanJq.stop().css("top", "-5px");
            spanJq.animate({
                top: "0"
            }, 200);
        }
    }

    function darken() {
        overlay.css("top", targetJq.position().top)
        overlay.css("height", $(document).height() - targetJq.position().top)
        overlay.css("display", "block")
        overlay.stop().animate({
            opacity: "0.4"
        }, {
            duration: 200
        });
    }

    function undarken() {
        overlay.stop().animate({
            opacity: "0"
        }, {
            duration: 100,
            complete: function() {
                overlay.css("display", "none");
            }
        });
    }

    function showDropdown($dropdown) {
        $dropdown.removeClass("force-hide");
        $dropdown.addClass("force-show");
        darken();
    }

    function hideDropdown($dropdown) {
        $dropdown.addClass("force-hide");
        $dropdown.removeClass("force-show");
        undarken();
    }

}

 
$(document).ready(function(){
  Nav({
    targetSelector: ".header-wrap nav"
  });
});