2014-04-03 126 views
0

我試圖用iScroll 5 http://iscrolljs.com/在jquery移動表上實現水平滾動,但它根本不起作用。垂直滑動起作用,但完全忽略了水平滾動。這裏是我的代碼:iScroll5&jquery移動表水平滾動

<body onload="loaded()"> 

    <div data-role="page" id="scroll" data-theme="a"> 
    <div data-role="content"> 

    <div id="wrapper"> 

     <table data-role="table" id="table-column-toggle" data-mode="columntoggle" class="ui-responsive table-stroke"> 
      <thead> 
       <tr> 
       <th data-priority="1">Rank</th> 
       <th data-priority="1">Movie Title </th> 
       <th data-priority="1">Year</th> 
       <th data-priority="1"><abbr title="Rotten Tomato Rating">Rating</abbr></th> 
       <th data-priority="1">Reviews</th> 
       <th data-priority="1">Rank</th> 
       <th data-priority="1">Movie Title </th> 
       <th data-priority="1">Year</th> 
       <th data-priority="1"><abbr title="Rotten Tomato Rating">Rating</abbr></th> 
       <th data-priority="1">Reviews</th> 
       </tr> 
      </thead> 
      <tbody> 
       <tr> 
       <th>1</th> 
       <td><a href="http://en.wikipedia.org/wiki/Citizen_Kane" data-rel="external">Citizen Kane</a></td> 
       <td>1941</td> 
       <td>100%</td> 
       <td>74</td> 
       <th>1</th> 
       <td><a href="http://en.wikipedia.org/wiki/Citizen_Kane" data-rel="external">Citizen Kane</a></td> 
       <td>1941</td> 
       <td>100%</td> 
       <td>74</td> 
       </tr> 
       <tr> 
       <th>2</th> 
       <td><a href="http://en.wikipedia.org/wiki/Casablanca_(film)" data-rel="external">Casablanca</a></td> 
       <td>1942</td> 
       <td>97%</td> 
       <td>64</td> 
       <th>1</th> 
       <td><a href="http://en.wikipedia.org/wiki/Citizen_Kane" data-rel="external">Citizen Kane</a></td> 
       <td>1941</td> 
       <td>100%</td> 
       <td>74</td> 
       </tr> 

      </tbody> 
      </table> 

    </div> <!-- end wrapper --> 

</div><!-- /content --> 

和jQuery的:

<script > 

    var myScroll; 

    function loaded() { 
    myScroll = new IScroll('#wrapper', { 
    eventPassthrough: true, 
    scrollX: true, 
    scrollY: false, 
    mouseWheel: true, 
    preventDefault: false 
    }); 

    } 

</script> 

沒有人有任何的想法是這一個?如果我刪除表格並放入列表中,它會像我期望的那樣水平滾動。這裏是的jsfiddle http://jsfiddle.net/7uAhg/

感謝

回答