如何在iScroll中实现水平滚动？

Question

我在iScroll中尝试过垂直滚动，它运行正常。当我试图实现水平滚动时，它不适用于我的应用程序。以下代码我使用了我的应用程序。

<style type="text/css">
  #report_wrapper{
    position: absolute;
    z-index: 1;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    overflow: hidden;
  }
  #report_scroller{ 
    position: absolute;
    z-index: 1; 
    /*-webkit-touch-callout:none;*/
    -webkit-tap-highlight-color: 
    rgba(0,0,0,0);width: 100%;padding: 0;
  }
</style>

<script>
  var windowWidth = $(window).width();
  var contentWidth = parseInt(windowWidth) - 2;
  $("#report_wrapper").css("width", contentWidth);
  myScroll = new iScroll('wrapper', { hScrollbar: true, vScrollbar: false, checkDOMChanges: true});
  myScroll.refresh();
</script>

<div data-role="content">
  <div id="divReportHead">Heading</div>     
    <div id="report_wrapper">
      <div id="report_scroller">
        <div id="divStatusReport">
          <table data-role="table" id="my-table" data-mode="columntoggle">
            <thead>
               <tr class="ui-bar-d">
                  <th>Column 1</th>
                  <th>Column 2</th>
                  <th>Column 3/Total</th>
                  <th>Column 4</th>
                  <th>Column 5</th>
                  <th>Column 6</th>
                  <th>Column 7</th>
                  <th>Column 8</th>
                  <th>Column 9</th>
               </tr>
             </thead>
             <tbody>
               <tr class="ui-bar-d">
                  <td>Ans 1</td>
                  <td>Ans 2</td>
                  <td>Ans 3/Total</td>
                  <td>Ans 4</td>
                  <td>Ans 5</td>
                  <td>Ans 6</td>
                  <td>Ans 7</td>
                  <td>Ans 8</td>
                  <td>Ans 9</td>
                </tr>
              </tbody>
            </table>
          </div>
        </div>
      </div>
    </div>
  </div>    

当我为这个包装器添加css时，它会隐藏我的表。请做好。