title: Fixed header and slide down content
body: <p>I'm running into trouble with this. I have a sticky header with a text box that when clicked slides down a results box and pushes the content down. It works ok when the header is positioned on top. The problem is when I scroll down the content and I click on the search text box and my results box is no longer visible. Here is the example: <a href="http://www.neolamanite.com/sites/all/themes/jquery/test.html" rel="nofollow">http://www.neolamanite.com/sites/all/themes/jquery/test.html</a></p>
  
  <p>For some add reason the client wants a sticky header but doesn't want the results box to go over the content. He wants the results box to push it down. Any ideas? Can this be fixed with jQuery </p>
  
  <p>Here is how the html looks like:</p>
  
  <pre><code>&lt;div class="sticky-header group"&gt;
    &lt;div class="sticky-header-inner"&gt;
   &lt;input type="text" class="text default-value" value="click here to open results" style="width: 300px;"&gt;
   &lt;/div&gt;
  &lt;/div&gt;&lt;!-- sticky header --&gt;
  &lt;div id="search-autosuggest"&gt;
   &lt;ul&gt;
     &lt;li&gt;Result 1&lt;/li&gt;
     &lt;li&gt;Result 2 &lt;/li&gt;
     &lt;li&gt;Result 3 &lt;/li&gt;
     &lt;li&gt;Result 4&lt;/li&gt;
   &lt;/ul&gt;
  &lt;/div&gt;&lt;!-- search-autosuggest --&gt;
  &lt;div id="sticky-wrapper"&gt;
   .... content here
  &lt;/div&gt;
  </code></pre>
  
  <p>Here is the example: <a href="http://www.neolamanite.com/sites/all/themes/jquery/test.html" rel="nofollow">http://www.neolamanite.com/sites/all/themes/jquery/test.html</a></p>
  
  <p>Works when there is no scrolling down. Not when scrolled down.</p>