как разделить большие числа строк таблицы на части или слайдер

Question

У меня есть report page witch получить данные из большой таблицы содержат более 1000 строк, как разделить этот отчет на части или слайдер, как почтовый ящик.

Answer 1

Проверить этот подход: DataTables

А вот демо:

БИБЛИОТЕКИ

jquery 1.11.0

jquery.dataTables.css

jquery.dataTables.min.js

JS

$(document).ready(function() { 
    $('table.display').dataTable(); 
}); 

CSS

div.dataTables_wrapper { 
     margin-bottom: 3em; 
    } 

HTML

<table id="" class="display" cellspacing="0" width="100%"> 
     <thead> 
      <tr> 
       <th>Name</th> 
       <th>Position</th> 
       <th>Office</th> 
       <th>Age</th> 
       <th>Salary</th> 
      </tr> 
     </thead> 

      <tfoot> 
      <tr> 
       <th>Name</th> 
       <th>Position</th> 
       <th>Office</th> 
       <th>Age</th> 
       <th>Salary</th> 
      </tr> 
     </tfoot> 

     <tbody> 
      <tr> 
      <td>Jena Gaines</td> 
      <td>Office Manager</td> 
      <td>London</td> 
      <td>30</td> 
      <td>$90,560</td> 
     </tr> 
     <tr> 
      <td>Haley Kennedy</td> 
      <td>Senior Marketing Designer</td> 
      <td>London</td> 
      <td>43</td> 
      <td>$313,500</td> 
     </tr> 
     <tr> 
      <td>Tatyana Fitzpatrick</td> 
      <td>Regional Director</td> 
      <td>London</td> 
      <td>19</td> 
      <td>$385,750</td> 
     </tr> 
     <tr> 
      <td>Michael Silva</td> 
      <td>Marketing Designer</td> 
      <td>London</td> 
      <td>66</td> 
      <td>$198,500</td> 
     </tr> 
     <tr> 
      <td>Bradley Greer</td> 
      <td>Software Engineer</td> 
      <td>London</td> 
      <td>41</td> 
      <td>$132,000</td> 
     </tr> 
     <tr> 
      <td>Angelica Ramos</td> 
      <td>Chief Executive Officer (CEO)</td> 
      <td>London</td> 
      <td>47</td> 
      <td>$1,200,000</td> 
     </tr> 
     <tr> 
      <td>Suki Burks</td> 
      <td>Developer</td> 
      <td>London</td> 
      <td>53</td> 
      <td>$114,500</td> 
     </tr> 
     <tr> 
      <td>Prescott Bartlett</td> 
      <td>Technical Author</td> 
      <td>London</td> 
      <td>27</td> 
      <td>$145,000</td> 
     </tr> 
     <tr> 
      <td>Timothy Mooney</td> 
      <td>Office Manager</td> 
      <td>London</td> 
      <td>37</td> 
      <td>$136,200</td> 
     </tr> 
     <tr> 
      <td>Bruno Nash</td> 
      <td>Software Engineer</td> 
      <td>London</td> 
      <td>38</td> 
      <td>$163,500</td> 
     </tr> 
     <tr> 
      <td>Hermione Butler</td> 
      <td>Regional Director</td> 
      <td>London</td> 
      <td>47</td> 
      <td>$356,250</td> 
     </tr> 
     <tr> 
      <td>Lael Greer</td> 
      <td>Systems Administrator</td> 
      <td>London</td> 
      <td>21</td> 
      <td>$103,500</td> 
     </tr> 
    </tbody> 
</table> 

Найти целиком на JsFiddle