title: jquery dropdown li does not dissapear
body: <p>I have two problems with a horizontal dropdown menu. I want it to display the dropdown area for the webpage which is active. In addition I want to add a time delay for hiding the menu when the user leaves the menu on accident so that it does not disappear. </p>
  
  <p>My HTML:</p>
  
  <pre><code>&lt;ul id="mainnnav"&gt;
  &lt;li id='home'&gt;
      Home
  &lt;/li&gt;
  &lt;li&gt;
      Contact
      &lt;ul class="subnav"&gt;
          &lt;li id = 'Adress'&gt;Adress&lt;/li&gt;
          &lt;li id = 'Telephone'&gt;Telephone&lt;/li&gt;
          &lt;li id = 'Email'&gt;E-mail&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/li&gt;
  &lt;li&gt;
      Services
      &lt;ul class="subnav"&gt;
          &lt;li id = 'Land'&gt;Land&lt;/li&gt;
          &lt;li id = 'Infrastructure'&gt;Infrastructure&lt;/li&gt;
          &lt;li id = 'Construction'&gt;Construction&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/li&gt;
  &lt;li&gt;
      The company
      &lt;ul class="subnav"&gt;
          &lt;li id = 'About'&gt;About&lt;/li&gt;
          &lt;li id = 'History'&gt;History&lt;/li&gt;
          &lt;li id = 'Media'&gt;Media&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/li&gt;
  &lt;/ul&gt;    
  </code></pre>
  
  <p>My jQuery:</p>
  
  <pre><code>&lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script type='text/javascript'&gt;
  $(document).ready(function () {
  var activepage = 'infrastructure'
  var activesubli = $('li#'+ activepage);
  var activemainli = activesubli.parents('li');
  var pagesub = activesubli.parent('.subnav');
  var timer;
  var latest;
  
  $('#mainnav li').hover(function () {
      $('ul:first',this).show();
      clearTimeout(timer);
  }, function () {
      latest = $('ul:first', this);
      timer = setTimeout(function () {
          latest.hide();
                      pagesub.show();
      }, 1000);
  });
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>Problem 1:
  So what I want to achieve is that when a customer is on the page 'Infrastructure' he sees the UL preceded by Services and when he scrolls the menu that the active dropdown menu disappears but shows up again when the customer leaves the menu (without clicking on a menu-item).  The problem is that the active dropdown menu does not disappear but stays in the background while the customer is hovering over other menu items. </p>
  
  <p>Problem 2:
  Another problem I'm facing is a problem with the timer. When the user leaves the menu I want the menu to display the last hovered dropdown segment for 1 second but than return to the active page dropdown menu. However, when I'm entering the dropdown menu again within the second it still disappears. </p>
  
  <p>Can someone please point out what I'm missing here?</p>