Search code examples
javascriptjqueryhtmldatatablesslimscroll

Slimscroll and jQuery Datatable


Im trying to do mix them. use a slimlcroll with jQuery DataTable (no pagination). So, I found these examples:

Nice simple use of slimscroll

Nice Table

Now I tried to make the content of the table use slim scroll but it just doesnt work :(

what I tried is to put a div serrounding the tbody - and slimscoll that div:

<div id="slimtest1">     
<tbody>
    ...
</tbody>
</div>

http://jsfiddle.net/yossico/hxkvfs60/2/

I also try to slim scroll the tbody directly: http://jsfiddle.net/yossico/hxkvfs60/3/

<tbody id="slimtest1">
...
</tbody>

What I want is to scroll the table body via slimscroll and not with the default scrollbar. None of this worked - can someone please show me the light?

Thanks :)


Solution

  • Check the Updated JSFiddle :- JSFiddle

       <table id="example" class="display" cellspacing="0" width="100%">
           ....
           <tbody id="slimtest1">
              ......
           </tbody>
       </table>
    

    CSS

    thead, tbody { display: block; }
    
    tbody {
       height: 200px;       /* For the demo  */
       overflow-y: auto;    /* Vertical scroll    */
       overflow-x: hidden;  /* Hide the horizontal scroll */
    }