title: How to make the form scroll alongwith the page scroll
body: <p>I have a mailchimp subscribe newsletter form. I want the form to scroll down alongwith the page is scroll.</p>
  
  <p>Right now it just <code>fadeIn</code>, <code>fadeOut</code>when the page is scrolled but I want it to also move down when the user is scrolling the page down.</p>
  
  <p>this is my html.</p>
  
  <pre><code>&lt;div class="container"&gt;
      &lt;div class="row"&gt;
          &lt;div class="pull-right"&gt;
              &lt;!-- Begin MailChimp Signup Form --&gt;
              &lt;link href="//cdn-images.mailchimp.com/embedcode/slim-10_7.css" rel="stylesheet" type="text/css"&gt;
              &lt;form id="subscribe-form" name="mc-embedded-subscribe-form" class="validate"&gt;
                  &lt;p&gt;Sign up for our newsletter&lt;/p&gt;
                  &lt;div id="signup_scroll"&gt;
                      &lt;div class="mc-field-group"&gt;
                          &lt;label for="mce-EMAIL"&gt;Email Address  &lt;span class="asterisk"&gt;*&lt;/span&gt;
                          &lt;/label&gt;
                          &lt;input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL" required&gt;
                      &lt;/div&gt;
                      &lt;div class="clear"&gt;&lt;input type="submit" value="Submit" name="subscribe" id="subscribe" class="button"&gt;&lt;/div&gt;
                  &lt;/div&gt;
              &lt;/form&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>JS</p>
  
  <pre><code>var amountScrolled = 300;
  $(window).scroll(function() {
      if ( $(window).scrollTop() &gt; amountScrolled ) {
          $('#subscribe-form').fadeIn('slow');
      } else {
          $('#subscribe-form').fadeOut('slow');
      }
  });
  
  $('#subscribe-form').click(function() {
      $('html, body').animate({
          scrollTop: 0
      }, 700);
      return false;
  });
  </code></pre>