问题
I have a striped table done using Bootstrap Table with the following code (from first example on http://wenzhixin.net.cn/p/bootstrap-table/docs/examples.html). I need to find a way for the scrollbar to look like one generated by slimScroll (http://rocha.la/jQuery-slimScroll). This is a non-negotiable client requirement.
<table data-toggle="table" data-url="data1.json" data-cache="false" data-height="299">
<thead>
<tr>
<th data-field="id">Item ID</th>
<th data-field="name">Item Name</th>
<th data-field="price">Item Price</th>
</tr>
</thead>
</table>
Questions:
1) Is this doable, and if so - how?
2) If this is not doable with bootstrap table, is there a library that would create a scrollbar of this type for a tbody? (slimScroll only works on a div, not a tbody)
3) If neither (1) nor (2) are possible, what are my options for a fixed-header scrollable-body table implementation with a scrollbar of this type?
Edit:
I am unable to create a fully-functional jsfiddle, since bootstrap-table doesn't appear to load via external resources. I was, however, able to create a jsfiddle showing what a tbody with slimScroll applied to it does. A stand-alone div scrolls fine. The tbody of the table following it does not.
回答1:
This works out of the box.
Inspecting the generated bootstrap table elements, it's not scrolling the <tbody>
but a wrapper div of '.fixed-table-body'
.
Just use:
$(document).ready(function () {
$('.fixed-table-body').slimScroll({});
});
Here's a working example.
来源:https://stackoverflow.com/questions/26427977/custom-scrollbar-for-bootstrap-table