jQuery mouseover on page load
<p>I have created a drop down menu using jQuery's mouseover event.
I would like to stop the event triggering if the cursor is over the menu on page load.</p>

<p>What I have seen happening is, the user clicks on a menu item which causes the relevant page to load. If they don't move their cursor, when the next page has loaded the mouseover event automatically fires becuase they are still hovering over the menu!</p>

<p>When this happens, the user doesn't realise the page has loaded; they just sit there waiting.</p>

<p>If you'd like to see what I mean, go to www.snowrepublic.co.uk and click on say, Gloves but dont move your cursor.
The Gloves page will load then the menu will instantly drop down. It's quite a large menu so you can see where the confusion comes from!</p>

<p>Here's my code:</p>

<pre><code>&lt;script type="text/javascript"&gt;
$(document).ready(function() {  
// Dropdown delay
  var $over = false;
  $('#header-nav li .nav').removeClass('drop');
  $('#header-nav li').mouseover(function(){
    $over = true;
    setTimeout( function(){ if ($over == true) $('#header-nav li .nav').addClass('drop'); }, 200 );
  });

  $('#header-nav li').mouseout(function(){
    $over = false;
    setTimeout( function(){ if ($over == false) $('#header-nav li .nav').removeClass('drop'); }, 200 );
  });
});
&lt;/script&gt;
</code></pre>

<p>Any way to stop the mouseover event firing on page load?</p>

<p>This is strange...I've just noticed this seems to be an intermittent problem. Sometimes the menu doesn't drop down on page load, other times it does????</p>
