2

jQuery Datatables のカスタムの外観の水平スクロールバーを取得しようとしています。これまでに見つけたいくつかの情報を使用して、次のようなものを思いつきました。

$('#table').dataTable({
    "bFilter": false,
    "bLengthChange": false,
    "bInfo": false,
    "sPaginationType": "two_button",
    "iDisplayLength": 6,                    

    "sScrollX": "100%",
    "sScrollXInner": "110%",
    "bScrollCollapse": true,            

    "fnInitComplete": function() {
        var table_header,
        _this = this;
        table_header = $('.dataTables_scrollHeadInner').css('position',
            'relative');
        $('body').find('.dataTables_scrollBody').bind('jsp-scroll-x',
            function(event, scrollPositionX, isAtLeft, isAtRight) {
                table_header.css('right', scrollPositionX);
            }).jScrollPane({
                verticalDragMinHeight: 8, 
                verticalDragMaxHeight: 8,
                horizontalDragMinWidth: 82, 
                horizontalDragMaxWidth: 82,
                autoReinitialise: true
            });
        }); 

正常に動作します: ただし、ウィンドウのサイズを変更すると、テーブル ヘッダーはコンテンツと同じように縮小されません (ヘッダーはコンテンツよりも幅が広くなっています)。ヘッダーと本文を均等にスクロールするために jScrollPane を jQuery Datatables にアタッチする方法はありますか? 私は次のようなことを意味します:

$('#blabla').find('.dataTables_scrollBody').jScrollPane();

ただし、scrollBody および scrollHead の場合。または、分割せずにスクロール可能な Datatable を初期化してヘッダーと本文を分離する方法はありますか?

ありがとう!

4

0 に答える 0