title: Bootstrap Datepicker scrolling issue
body: <p>Experiencing a strange scrolling issue on my website where the bootstrap datepicker calendar doesn't stay with the input box that its attached to. Tried my best to recreate it in a jsfiddle. (in the box scroll with your mouse wheel then click on the input box to view the calendar.) Im aware it doesnt appear in front but that isnt the issue, it was just for recreational purposes. You will notice that it doesn't scroll correctly with the input box which is what im trying to fix.</p>
  
  <p>My original code was: </p>
  
  <pre><code> $(".datepicker-input").each(function(){ $(this).datepicker();});
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;input type="text" class="datepicker-input" /&gt;
  </code></pre>
  
  <p>Script:</p>
  
  <pre><code>    var datePicker = $().datepicker({});
      var t;
      $(window).on('DOMMouseScroll mousewheel scroll', function() {
          window.clearTimeout(t);
          t = window.setTimeout(function() {
              $('.datepicker-input').datepicker('place');
          }, 100);
      });
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>html,body {
      overflow-x: hidden;
      position: relative;
      min-height: 100%;
  }
  
  .datepicker-input {
      margin-top: 250px;
      margin-left: 100px;
  }
  
  .dropdown-menu {
      font-size: 13px;
      margin-left: 20px;
  }
  </code></pre>
  
  <p>Link to jsfiddle: <a href="http://jsfiddle.net/8C6jT/1/" rel="nofollow">http://jsfiddle.net/8C6jT/1/</a> (Thanks A. Wolff)</p>
  
  <p><strong>EDIT:</strong></p>
  
  <p>This function is some what effective in Chrome and IE.. it still causes the calendar to move away from the input box if you scroll too quickly but it doesn't work for Firefox.</p>