title: Bottom div slide up/down on hover to exact margins
body: <p>I want the bottom div to slide up down on hover at the bottom of screen.  But, I want the text link to move with it.  BUT, have the like slide down and stop like bottom:20px so it still visible to slide back up.  Here's an example: <a href="http://sorendahljeppesen.dk/" rel="nofollow">http://sorendahljeppesen.dk/</a>.  Here's what I got so far:  (the link isn't set to move with the dive cause it keeps vanishing below the screen on hover).</p>
  
  <p>Jquery: </p>
  
  <pre><code>&lt;script type='text/javascript'&gt;
  
  $(document).ready(function(){
       $("#mp3-text a").hover(function() {
        $("#mp3-player").stop().slideToggle(1000, function () {
          $(noop);
          $("#mp3-player").slideToggle(1000);
        });
       });
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>#mp3-player-holder {
      height:100px;
      width:960px;
      bottom:0;
      margin-left:auto;
      margin-right:auto;
      position:relative;
      z-index:1000;
      overflow:hidden;
      }
  
  #mp3-player {
      height:95px;
      width:100%;
      bottom:0;
      position:absolute;
      border-top:1px solid #ccc;
      border-right:0px;
      border-bottom:0px;
      border-left:0px;
      z-index:1000;
      text-align:center;
      }       
  </code></pre>