title: jQuery Waypoints won't trigger
body: <p>I'm trying to use jQuery Waypoints in a website I'm building, but can't get it to trigger at all. Here's my code:</p>
  
  <pre><code>&lt;script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="js/waypoints.min.js"&gt;&lt;/script&gt;
  &lt;script&gt;
          $(document).ready(function(){
              $('#div-a').waypoint(function() {
                  console.log("waypoint a reached");
              });
              $('#div-b').waypoint(function() {
                  console.log("waypoint b reached");
              });
          });
  &lt;/script&gt;
  </code></pre>
  
  <p>I've tried this with and without <code>$(document).ready(function(){</code>. Here's my CSS:</p>
  
  <pre><code>#div-a {
      height: 1000px;
      background-color:#EAEAEA; 
  }
  #div-b {
      height: 1000px;
      background-color:#D8D5E2; 
  }
  </code></pre>
  
  <p>the divs are filled with placeholder text. The divs are surrounded by a container div with this css:</p>
  
  <pre><code>#container {
      margin: 0;
      height: 100%;
      width: 100%;
      background-color:#8DA7CD;
      overflow:auto;
  }
  </code></pre>
  
  <p>Thank you. All of this is up live at <a href="http://wilsonbiggs.com/sandy/" rel="nofollow">http://wilsonbiggs.com/sandy/</a></p>