title: Floating multiple elements in html
body: <p>In this demo (<a href="http://jsfiddle.net/vp3Q3/" rel="nofollow">http://jsfiddle.net/vp3Q3/</a>) I would like the first tab to stay in same position until it reaches second tab and then second tab stays in same position until third tab etc...</p>
  
  <p>I managed to build that first tab jump to then end of first div but what I need is not to jump to the end but to float smoothly down as I scroll.</p>
  
  <p>Is this possible? </p>
  
  <p>This is my code</p>
  
  <pre><code>  function makeItFloat() {
  
      //alert('g');
      for (var i = 0; i &lt; 3; i++) {
          $("#test" + i).position({
              my: "left-35 top",
              at: "left top",
              of: "#imgDiv" + i
          });
      }
  }
  
  window.onload = function() {
      makeItFloat();
      $(window).scroll(function() {
          makeItFloat()
      });
  }
  </code></pre>