Features - ScrollResize: Support for DataTables 2+

pull/583/head
Allan Jardine 7 months ago
parent a3912c9889
commit 8939a585fb

@ -41,7 +41,7 @@
// Browser
factory( jQuery, window, document );
}
}(function( $, window, document, undefined ) {
}(function( $, window, document ) {
'use strict';
var DataTable = $.fn.dataTable;
@ -112,13 +112,13 @@ ScrollResize.prototype = {
var t = dt.table();
var offsetTop = $(settings.table).offset().top;
var availableHeight = settings.host.height();
var scrollBody = $('div.dataTables_scrollBody', t.container());
var scrollBody = $('div.dt-scroll-body', t.container());
// Subtract the height of the header, footer and the elements
// surrounding the table
availableHeight -= offsetTop;
availableHeight -=
settings.container.height() - (offsetTop + scrollBody.height());
$('div.dataTables_scrollBody', t.container()).css({
$('div.dt-scroll-body', t.container()).css({
maxHeight: availableHeight,
height: availableHeight,
});

@ -72,13 +72,13 @@ ScrollResize.prototype = {
var t = dt.table();
var offsetTop = $(settings.table).offset().top;
var availableHeight = settings.host.height();
var scrollBody = $('div.dataTables_scrollBody', t.container());
var scrollBody = $('div.dt-scroll-body', t.container());
// Subtract the height of the header, footer and the elements
// surrounding the table
availableHeight -= offsetTop;
availableHeight -=
settings.container.height() - (offsetTop + scrollBody.height());
$('div.dataTables_scrollBody', t.container()).css({
$('div.dt-scroll-body', t.container()).css({
maxHeight: availableHeight,
height: availableHeight,
});

@ -5,7 +5,7 @@
<title>DataTables page resize example</title>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.6/css/jquery.dataTables.min.css">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/2.0.0/css/dataTables.dataTables.min.css">
<style type="text/css">
#resize_wrapper {
position: absolute;
@ -16,8 +16,8 @@
}
</style>
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script type="text/javascript" language="javascript" src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.7.1.js"></script>
<script type="text/javascript" language="javascript" src="https://cdn.datatables.net/2.0.0/js/dataTables.min.js"></script>
<script type="text/javascript" language="javascript" src="dataTables.scrollResize.js"></script>
<script type="text/javascript" charset="utf-8">
$(document).ready( function () {

@ -5,7 +5,7 @@
<title>DataTables page resize example</title>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.6/css/jquery.dataTables.min.css">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/2.0.0/css/dataTables.dataTables.min.css">
<style type="text/css">
div.container {
margin: 0 auto;
@ -28,8 +28,8 @@
}
</style>
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script type="text/javascript" language="javascript" src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.7.1.js"></script>
<script type="text/javascript" language="javascript" src="https://cdn.datatables.net/2.0.0/js/dataTables.min.js"></script>
<script type="text/javascript" language="javascript" src="dataTables.scrollResize.js"></script>
<script type="text/javascript" charset="utf-8">
$(document).ready( function () {

@ -5,7 +5,7 @@
<title>DataTables page resize example</title>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.6/css/jquery.dataTables.min.css">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/2.0.0/css/dataTables.dataTables.min.css">
<style type="text/css">
div.container {
margin: 0 auto;
@ -47,8 +47,8 @@
}
</style>
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script type="text/javascript" language="javascript" src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.7.1.js"></script>
<script type="text/javascript" language="javascript" src="https://cdn.datatables.net/2.0.0/js/dataTables.min.js"></script>
<script type="text/javascript" language="javascript" src="dataTables.scrollResize.js"></script>
<script type="text/javascript" charset="utf-8">
$(document).ready( function () {

@ -5,7 +5,7 @@
<title>DataTables page resize example</title>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.6/css/jquery.dataTables.min.css">
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/2.0.0/css/dataTables.dataTables.min.css">
<style type="text/css">
#resize_wrapper {
height: 200px;
@ -15,8 +15,8 @@
}
</style>
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script type="text/javascript" language="javascript" src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-3.7.1.js"></script>
<script type="text/javascript" language="javascript" src="https://cdn.datatables.net/2.0.0/js/dataTables.min.js"></script>
<script type="text/javascript" language="javascript" src="dataTables.scrollResize.js"></script>
<script type="text/javascript" charset="utf-8">
$(document).ready( function () {

@ -91,7 +91,7 @@ ScrollResize.prototype = {
var t = dt.table();
var offsetTop = $(settings.table).offset()!.top;
var availableHeight = settings.host.height();
var scrollBody = $('div.dataTables_scrollBody', t.container());
var scrollBody = $('div.dt-scroll-body', t.container());
// Subtract the height of the header, footer and the elements
// surrounding the table
@ -99,7 +99,7 @@ ScrollResize.prototype = {
availableHeight -=
settings.container.height() - (offsetTop + scrollBody.height()!);
$('div.dataTables_scrollBody', t.container()).css({
$('div.dt-scroll-body', t.container()).css({
maxHeight: availableHeight,
height: availableHeight,
});

Loading…
Cancel
Save