title: Mouseover & Mouseout with jQuery problems with a input field
body: <p><strong>OLD CODE</strong></p>
  
  <p>I got a problem when I over my "#search" div then it slides it like I should do, bur the problem is when it slides out it reveals a search input field, and when the mouse gets over that input field it starts to run the mouse out function, I've stopped this by giving a if mouse over #search input with a empty function but when my mouse leaves the input AND the "#search" dive it wont run the animate back function.</p>
  
  <p>Here's my script</p>
  
  <pre><code>$("#search").mouseover(function(){
      $(this).animate({"left": "0px"}, 500);
  });
  $("#search").mouseout(function(){
      if($("#search input").mouseover()){
          return false
          }
      else {
      $(this).animate({"left": "-282px"}, 500);
      }
  });
  </code></pre>
  
  <p>What do I do wrong? Or do anyone have a solution? I'm new to jQuery so just started learning :) and I've searched Google and the documentation for last 2 days, maybe its just me that's blind, that's why I need your help :</p>
  
  <p><strong>EDIT: NEW CODE &amp; JS FIDDLE</strong></p>
  
  <p>I need to do the search bar different so I just made the code again now the statement needs to be clicked instead. Look here at JSfiddle</p>
  
  <p><a href="http://jsfiddle.net/D7s45/2/" rel="nofollow">http://jsfiddle.net/D7s45/2/</a></p>
  
  <p>That's the jQuery I wanted to create :)</p>