如何选择项目并放入单独的盒子？

Question

我创建了项目表，需要将它们移动到一个单独的浮动框中（点击网站用户点击“添加”按钮后滚动）。

目前我已创建项目表并设法创建浮动框：

window.onload = function() {

  function getScrollTop() {
    if (typeof window.pageYOffset !== 'undefined') {
      return window.pageYOffset;
    }

    var d = document.documentElement;
    if (d.clientHeight) {
      return d.scrollTop;
    }
    return document.body.scrollTop;
  }

  window.onscroll = function() {
    var box = document.getElementById('box'),
      scroll = getScrollTop();

    if (scroll <= 28) {
      box.style.top = "50px";
    } else {
      box.style.top = (scroll + 2) + "px";
    }
  };

};

 #box {
   position: absolute;
   top: 100px;
   background-color: #dad9c7;
   margin-left: 200px;
   left: 70%;
   width: 200px;
   height: 50px;
   border: 5px solid #393c3d;
   text-align: center;
 }

<div>
  <u><h2>Batteries</h2></u> 
  <table id="myTable" class="tablesorter border">
    <thead>
      <tr>
        <th>Battery</th>
        <th>Weight</th>
        <th>Capacity</th>
        <th>discharge</th>
        <th>Price</th>
        <th>List</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>Turnigy nano-tech 1000mAh</td>
        <td>99g</td>
        <td>1000mAh</td>
        <td>25~50C</td>
        <td>$10.15</td>
        <td>Add</td>
      </tr>
    </tbody>
  </table>
</div>

<div id='box'><u>Parts List</u>
</div>

帮助将不胜感激，谢谢。