From 2d85e85937463b3a15da5e7bb2a8536bbcffb621 Mon Sep 17 00:00:00 2001 From: Mark Malek Date: Sat, 14 May 2011 17:13:45 -0400 Subject: [PATCH 01/18] Create branch v1.3 Updated version numbers to 1.3 --- README.md | 2 +- jquery.fixedheadertable.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index a2835b5..a145cc6 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ -## Version 1.2.2 +## Version 1.3 - jquery.fixedheadertable.js ## Methods: diff --git a/jquery.fixedheadertable.js b/jquery.fixedheadertable.js index 5301585..c378dd5 100644 --- a/jquery.fixedheadertable.js +++ b/jquery.fixedheadertable.js @@ -11,7 +11,7 @@ * jQuery authoring guidelines * * Launch : October 2009 -* Version : 1.2.2 +* Version : 1.3 * Released: May 9th, 2011 * * From 4e683dfb7cb04ca4e910948389c2e487142cf410 Mon Sep 17 00:00:00 2001 From: Mark Malek Date: Sun, 15 May 2011 23:35:20 -0400 Subject: [PATCH 02/18] New Feature: Added support for fixed left column. Bugs still remain in non-webkit based browsers --- css/defaultTheme.css | 19 +++++- demo/demo.js | 2 +- demo/test.html | 6 +- jquery.fixedheadertable.js | 135 +++++++++++++++++++++++++++++++++---- 4 files changed, 145 insertions(+), 17 deletions(-) diff --git a/css/defaultTheme.css b/css/defaultTheme.css index 3b684e4..5207a8b 100644 --- a/css/defaultTheme.css +++ b/css/defaultTheme.css @@ -38,8 +38,12 @@ /* @group Content */ -div.fht-table-wrapper { +div.fht-table-wrapper, +div.fht-thead, +div.fht-tfoot, +.fht-fixed-column .fht-tbody { overflow: hidden; + position: relative; } div.fht-tbody { @@ -51,5 +55,18 @@ div.fht-tbody { overflow: hidden; height: 1px; } + +.fht-fixed-column, +.fht-fixed-body { + /* position */ + top: 0; + left: 0; + position: absolute; + } + +.fht-fixed-column { + /* position */ + z-index: 1; + } /* @end */ \ No newline at end of file diff --git a/demo/demo.js b/demo/demo.js index 2f8c878..c004129 100644 --- a/demo/demo.js +++ b/demo/demo.js @@ -5,7 +5,7 @@ $(document).ready(function() { $('.myTable02').fixedHeaderTable({ width: '600', height: '250', footer: true, altClass: 'odd', themeClass: 'fancyDarkTable' }); - $('.myTable03').fixedHeaderTable({ width: '400', height: '400', altClass: 'odd', footer: true, themeClass: 'fancyDarkTable' }); + $('.myTable03').fixedHeaderTable({ width: '400', height: '400', altClass: 'odd', footer: true, fixedColumn: true, themeClass: 'fancyTable' }); $('a.makeTable').bind('click', function() { diff --git a/demo/test.html b/demo/test.html index 3391c8e..6e4bc9b 100644 --- a/demo/test.html +++ b/demo/test.html @@ -7,7 +7,7 @@ - + @@ -379,7 +379,7 @@ Firefox 1,990 3.11 - 00:04:22 + 00:04:22 test test test 70.00% 32.61% 00:04:22 @@ -391,7 +391,7 @@ 1,990 3.11 00:04:22 - 70.00% + 70.00% test test test 32.61% 00:04:22 70.00% diff --git a/jquery.fixedheadertable.js b/jquery.fixedheadertable.js index c378dd5..469879b 100644 --- a/jquery.fixedheadertable.js +++ b/jquery.fixedheadertable.js @@ -30,11 +30,11 @@ borderCollapse: true, themeClass: 'fht-default', + fixedColumn: false, // fixed first column autoShow: true, // hide table after its created loader: false, footer: false, // show footer cloneHeadToFoot: false, // clone head and use as footer - cloneHeaderToFooter: false, // deprecated option autoResize: false, // resize table if its parent wrapper changes size create: null // callback after plugin completes @@ -105,6 +105,13 @@ $wrapper = $self.closest('.fht-table-wrapper'); + if ( settings.fixedColumn == true && $wrapper.find('.fht-fixed-column').length == 0 ) { + $self.wrap('
'); + + var $fixedColumn = $('
').prependTo($wrapper), + $fixedBody = $wrapper.find('.fht-fixed-body'); + } + $wrapper.css({ width: settings.width, height: settings.height @@ -122,8 +129,12 @@ helpers._setupClone( $divBody, tableProps.tbody ); - if ( !$self.hasClass('fht-table-init') ) { - $divHead = $('
').prependTo($wrapper); + if ( !$self.hasClass('fht-table-init') ) { + if ( settings.fixedColumn == true ) { + $divHead = $('
').prependTo($fixedBody); + } else { + $divHead = $('
').prependTo($wrapper); + } $thead.clone().appendTo($divHead.find('table')); } else { @@ -133,7 +144,7 @@ helpers._setupClone( $divHead, tableProps.thead ); $self.css({ - 'margin-top': -$thead.outerHeight(true) - tableProps.border + 'margin-top': -$divHead.find('table').outerHeight(true) - tableProps.border }); /* @@ -157,10 +168,6 @@ 'height': tbodyHeight }); - if ( !settings.autoShow ) { - $wrapper.hide(); - } - $self.addClass('fht-table-init'); if ( typeof(settings.altClass) !== 'undefined' ) { @@ -168,7 +175,15 @@ .addClass(settings.altClass); } - helpers._bindScroll( $divBody ); + if ( settings.fixedColumn == true ) { + helpers._setupFixedColumn( $self, self, tableProps ); + } + + if ( !settings.autoShow ) { + $wrapper.hide(); + } + + helpers._bindScroll( $divBody, tableProps ); return self; }, @@ -303,12 +318,21 @@ * return void * bind scroll event */ - _bindScroll: function( $obj ) { + _bindScroll: function( $obj, tableProps ) { var $self = $obj, $thead = $self.siblings('.fht-thead'), $tfoot = $self.siblings('.fht-tfoot'); $self.bind('scroll', function() { + if ( settings.fixedColumn == true ) { + var $fixedColumn = $('.fht-fixed-column'); + + $fixedColumn.find('.fht-tbody table') + .css({ + 'margin-top': -$self.scrollTop() - $thead.outerHeight() - tableProps.border + }); + } + $thead.find('table') .css({ 'margin-left': -this.scrollLeft @@ -323,6 +347,89 @@ }); }, + /* + * return void + */ + _setupFixedColumn: function ( $obj, obj, tableProps ) { + var $self = $obj, + self = obj, + $wrapper = $self.closest('.fht-table-wrapper'), + $fixedBody = $wrapper.find('.fht-fixed-body'), + $fixedColumn = $wrapper.find('.fht-fixed-column'), + $thead = $('
'), + $tbody = $('
'), + $tfoot = $('
'), + $firstChild = $fixedBody.find('.fht-thead thead tr th:first-child'), + fixedColumnWidth, + fixedBodyWidth, + fixedBodyHeight, + $newRow; + + // setup the header + $thead.prependTo($fixedColumn) + .find('tr') + .append( + $fixedBody.find('.fht-thead thead tr th:first-child').clone() + .css('height', $firstChild.height() + tableProps.border) + ); + + // Fix th height for Firefox 4 + if ( $thead.find('tr th').height() < $firstChild.height() ) { + $thead.find('tr th').css({ + 'height': $firstChild.outerHeight() + }); + } + + fixedColumnWidth = $thead.find('table').outerWidth(true); + fixedBodyWidth = $wrapper.width(); + fixedBodyHeight = $fixedBody.find('.fht-tbody').height(); + + $fixedColumn.css({ + 'width': fixedColumnWidth + }); + + $fixedBody.css({ + 'width': fixedBodyWidth + }); + + $tbody.css({ + 'height': fixedBodyHeight - settings.scrollbarOffset + }) + .find('table') + .css({ + 'margin-top': -$thead.find('table').outerHeight(true) - tableProps.border + }); + + $tbody.appendTo($fixedColumn) + .find('thead tr') + .append( + $thead.find('th') + .clone() + ); + + $fixedBody.find('tbody tr td:first-child') + .each(function(index) { + $newRow = $('').appendTo($tbody.find('tbody')) + .append($(this).clone() + .css('height', parseInt($(this).height() + tableProps.border)) + ); + + if ( $(this).parent().hasClass('odd') ) { + $newRow.addClass('odd'); + } + + if ( $newRow.find('td').height() < $(this).height() ) { + $newRow.find('td').css({ + 'height': $(this).outerHeight() + }); + } + }); + + if ( settings.footer == true || settings.cloneHeadToFoot == true ) { + $tfoot.appendTo($fixedColumn); + } + }, + /* * return void */ @@ -335,7 +442,11 @@ $divFoot = $wrapper.find('div.fht-tfoot'); if ( !$divFoot.length ) { - $divFoot = $('
').appendTo($wrapper); + if ( settings.fixedColumn == true ) { + $divFoot = $('
').appendTo($wrapper.find('.fht-fixed-body')); + } else { + $divFoot = $('
').appendTo($wrapper); + } } switch (true) { @@ -418,7 +529,7 @@ * Fixed Header and Footer should extend the full width * to align with the scrollbar of the body */ - if ( !$(this).closest('.fht-tbody').length && $(this).is(':last-child') ) { + if ( !$(this).closest('.fht-tbody').length && $(this).is(':last-child') && !$(this).closest('.fht-fixed-column').length ) { var padding = ( ( $(this).innerWidth() - $(this).width() ) / 2 ) + settings.scrollbarOffset; $(this).css({ 'padding-right': padding + 'px' From 6de54fb1bb3eb915099afd0cbc6f5ddabe5b4d59 Mon Sep 17 00:00:00 2001 From: Mark Malek Date: Wed, 18 May 2011 00:47:25 -0400 Subject: [PATCH 03/18] Bug fix: Improved fixed column performance. Fixed bugs in Firefox 4 and IE with fixed columns. --- css/defaultTheme.css | 62 ++++++++----- jquery.fixedheadertable.js | 173 ++++++++++++++++++++++++------------- 2 files changed, 149 insertions(+), 86 deletions(-) diff --git a/css/defaultTheme.css b/css/defaultTheme.css index 5207a8b..61927f8 100644 --- a/css/defaultTheme.css +++ b/css/defaultTheme.css @@ -21,15 +21,20 @@ .fht-table tr, .fht-table th, .fht-table td { + /* position */ margin: 0; + + /* size */ padding: 0; + /* text */ font-size: 100%; font: inherit; vertical-align: baseline; } .fht-table { + /* appearance */ border-collapse: collapse; border-spacing: 0; } @@ -38,35 +43,44 @@ /* @group Content */ -div.fht-table-wrapper, -div.fht-thead, -div.fht-tfoot, -.fht-fixed-column .fht-tbody { +.fht-table-wrapper, +.fht-table-wrapper .fht-thead, +.fht-table-wrapper .fht-tfoot, +.fht-table-wrapper .fht-fixed-column .fht-tbody, +.fht-table-wrapper .fht-fixed-body .fht-tbody, +.fht-table-wrapper .fht-tbody { + /* appearance */ overflow: hidden; + + /* position */ position: relative; } -div.fht-tbody { - overflow-y: auto; - overflow-x: auto; - } + .fht-table-wrapper .fht-fixed-body .fht-tbody, + .fht-table-wrapper .fht-tbody { + /* appearance */ + overflow: auto; + } -.fht-table .fht-cell { - overflow: hidden; - height: 1px; - } + .fht-table-wrapper .fht-table .fht-cell { + /* appearance */ + overflow: hidden; + + /* size */ + height: 1px; + } -.fht-fixed-column, -.fht-fixed-body { - /* position */ - top: 0; - left: 0; - position: absolute; - } - -.fht-fixed-column { - /* position */ - z-index: 1; - } + .fht-table-wrapper .fht-fixed-column, + .fht-table-wrapper .fht-fixed-body { + /* position */ + top: 0; + left: 0; + position: absolute; + } + + .fht-table-wrapper .fht-fixed-column { + /* position */ + z-index: 1; + } /* @end */ \ No newline at end of file diff --git a/jquery.fixedheadertable.js b/jquery.fixedheadertable.js index 469879b..8c8ec94 100644 --- a/jquery.fixedheadertable.js +++ b/jquery.fixedheadertable.js @@ -83,7 +83,8 @@ $fixedHeadRow, $temp, tfootHeight = 0; - + + settings.includePadding = helpers._isPaddingIncludedWithWidth(); settings.scrollbarOffset = helpers._getScrollbarWidth(); settings.themeClassName = settings.themeClass; @@ -144,7 +145,7 @@ helpers._setupClone( $divHead, tableProps.thead ); $self.css({ - 'margin-top': -$divHead.find('table').outerHeight(true) - tableProps.border + 'margin-top': -$divHead.outerHeight(true) }); /* @@ -329,7 +330,7 @@ $fixedColumn.find('.fht-tbody table') .css({ - 'margin-top': -$self.scrollTop() - $thead.outerHeight() - tableProps.border + 'margin-top': -$self.scrollTop() }); } @@ -347,6 +348,30 @@ }); }, + /* + * return void + */ + _fixHeightWithCss: function ( $obj, tableProps ) { + if ( settings.includePadding ) { + $obj.css({ + 'height': $obj.height() + tableProps.border + }); + } else { + $obj.css({ + 'height': $obj.parent().height() + tableProps.border + }); + } + }, + + /* + * return void + */ + _fixWidthWithCss: function( $obj, tableProps ) { + $obj.css({ + 'width': $obj.width() + tableProps.border + }); + }, + /* * return void */ @@ -357,76 +382,66 @@ $fixedBody = $wrapper.find('.fht-fixed-body'), $fixedColumn = $wrapper.find('.fht-fixed-column'), $thead = $('
'), - $tbody = $('
'), - $tfoot = $('
'), - $firstChild = $fixedBody.find('.fht-thead thead tr th:first-child'), - fixedColumnWidth, - fixedBodyWidth, - fixedBodyHeight, + $tbody = $('
'), + $tfoot = $('
'), + $firstThChild = $fixedBody.find('.fht-thead thead tr th:first-child'), + $firstTdChildren, + fixedColumnWidth = $firstThChild.outerWidth(true) + tableProps.border, + fixedBodyWidth = $wrapper.width(), + fixedBodyHeight = $fixedBody.find('.fht-tbody').height() - settings.scrollbarOffset, $newRow; - // setup the header - $thead.prependTo($fixedColumn) - .find('tr') - .append( - $fixedBody.find('.fht-thead thead tr th:first-child').clone() - .css('height', $firstChild.height() + tableProps.border) - ); + // Fix cell heights + helpers._fixHeightWithCss( $firstThChild, tableProps ); + helpers._fixWidthWithCss( $firstThChild, tableProps ); + $firstTdChildren = $fixedBody.find('tbody tr td:first-child') + .each( function(index) { + helpers._fixHeightWithCss( $(this), tableProps ); + helpers._fixWidthWithCss( $(this), tableProps ); + }); - // Fix th height for Firefox 4 - if ( $thead.find('tr th').height() < $firstChild.height() ) { - $thead.find('tr th').css({ - 'height': $firstChild.outerHeight() - }); - } + // clone header + $thead.appendTo($fixedColumn) + .find('tr') + .append($firstThChild.clone()); - fixedColumnWidth = $thead.find('table').outerWidth(true); - fixedBodyWidth = $wrapper.width(); - fixedBodyHeight = $fixedBody.find('.fht-tbody').height(); + $tbody.appendTo($fixedColumn) + .css({ + 'margin-top': -1, + 'height': fixedBodyHeight + tableProps.border + }); + $firstTdChildren.each(function(index) { + $newRow = $('').appendTo($tbody.find('tbody')); + if ( settings.altClass && $(this).parent().hasClass(settings.altClass) ) { + $newRow.addClass(settings.altClass); + } + + $(this).clone() + .appendTo($newRow); + }); + + // set width of fixed column wrapper $fixedColumn.css({ 'width': fixedColumnWidth }); + // set width of body table wrapper $fixedBody.css({ - 'width': fixedBodyWidth + 'width': fixedBodyWidth }); - $tbody.css({ - 'height': fixedBodyHeight - settings.scrollbarOffset - }) - .find('table') - .css({ - 'margin-top': -$thead.find('table').outerHeight(true) - tableProps.border - }); - - $tbody.appendTo($fixedColumn) - .find('thead tr') - .append( - $thead.find('th') - .clone() - ); - - $fixedBody.find('tbody tr td:first-child') - .each(function(index) { - $newRow = $('').appendTo($tbody.find('tbody')) - .append($(this).clone() - .css('height', parseInt($(this).height() + tableProps.border)) - ); - - if ( $(this).parent().hasClass('odd') ) { - $newRow.addClass('odd'); - } - - if ( $newRow.find('td').height() < $(this).height() ) { - $newRow.find('td').css({ - 'height': $(this).outerHeight() - }); - } - }); - + // setup clone footer with fixed column if ( settings.footer == true || settings.cloneHeadToFoot == true ) { - $tfoot.appendTo($fixedColumn); + var $firstTdFootChild = $fixedBody.find('.fht-tfoot thead tr th:first-child'); + + helpers._fixHeightWithCss( $firstTdFootChild, tableProps ); + $tfoot.appendTo($fixedColumn) + .find('tr') + .append($firstTdFootChild.clone()); + $tfoot.css({ + 'top': settings.scrollbarOffset + tableProps.border + }); } }, @@ -486,9 +501,14 @@ tbody: {}, tfoot: {}, border: 0 - }; + }, + borderCollapse = 1; + + if ( settings.borderCollapse == true ) { + borderCollapse = 2; + } - tableProp.border = ( $obj.find('th:first-child').outerWidth() - $obj.find('th:first-child').innerWidth() ) / 2; + tableProp.border = ( $obj.find('th:first-child').outerWidth() - $obj.find('th:first-child').innerWidth() ) / borderCollapse; $obj.find('thead tr:first-child th').each(function(index) { tableProp.thead[index] = $(this).width() + tableProp.border; @@ -538,6 +558,35 @@ }); }, + /* + * return boolean + * Determine how the browser calculates fixed widths with padding for tables + * true if width = padding + width + * false if width = width + */ + _isPaddingIncludedWithWidth: function() { + var $obj = $('
test
'), + defaultHeight, + newHeight; + + $obj.appendTo('body'); + + defaultHeight = $obj.find('td').height(); + + $obj.find('td') + .css('height', $obj.find('tr').height()); + + newHeight = $obj.find('td').height(); + $obj.remove(); + + if ( defaultHeight != newHeight ) { + return true; + } else { + return false; + } + + }, + /* * return int * get the width of the browsers scroll bar From 0d2a5a1148df8c234ed7e6a1aaa5bd9b96d47ca1 Mon Sep 17 00:00:00 2001 From: Mark Malek Date: Wed, 18 May 2011 01:06:30 -0400 Subject: [PATCH 04/18] Bug fix: Bind scroll event to current table object, not all tables. --- jquery.fixedheadertable.js | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/jquery.fixedheadertable.js b/jquery.fixedheadertable.js index 8c8ec94..bb59cd1 100644 --- a/jquery.fixedheadertable.js +++ b/jquery.fixedheadertable.js @@ -212,14 +212,13 @@ if ( typeof(arg1) !== 'undefined' && typeof(arg1) === 'number' ) { $wrapper.show(arg1, function() { - $.isFunction(arg3) && arg3.call(this); + $.isFunction(arg2) && arg2.call(this); }); - + return self; } else if ( typeof(arg1) !== 'undefined' && typeof(arg1) === 'string' && typeof(arg2) !== 'undefined' && typeof(arg2) === 'number' ) { - // User provided show duration with an effect $wrapper.show(arg1, arg2, function() { @@ -232,7 +231,7 @@ $self.closest('.fht-table-wrapper') .show(); - $.isFunction(arg3) && arg3.call(this); + $.isFunction(arg1) && arg1.call(this); return self; }, @@ -321,12 +320,13 @@ */ _bindScroll: function( $obj, tableProps ) { var $self = $obj, + $wrapper = $self.closest('.fht-table-wrapper'), $thead = $self.siblings('.fht-thead'), $tfoot = $self.siblings('.fht-tfoot'); $self.bind('scroll', function() { if ( settings.fixedColumn == true ) { - var $fixedColumn = $('.fht-fixed-column'); + var $fixedColumn = $wrapper.find('.fht-fixed-column'); $fixedColumn.find('.fht-tbody table') .css({ From f2d56ef374dc86c4b4e8103922bec1f2af0f301c Mon Sep 17 00:00:00 2001 From: Mark Malek Date: Wed, 18 May 2011 01:07:14 -0400 Subject: [PATCH 05/18] Update demo: Updated demo file with new examples. --- demo/css/myTheme.css | 2 +- demo/demo.js | 17 +- demo/test.html | 1583 ++++++++++++++++++++++++++---------------- 3 files changed, 971 insertions(+), 631 deletions(-) diff --git a/demo/css/myTheme.css b/demo/css/myTheme.css index bda2a23..25a596d 100644 --- a/demo/css/myTheme.css +++ b/demo/css/myTheme.css @@ -1,5 +1,5 @@ .divider { - margin: 20px 0; + margin-top: 40px; } .button { diff --git a/demo/demo.js b/demo/demo.js index c004129..eb253d0 100644 --- a/demo/demo.js +++ b/demo/demo.js @@ -1,20 +1,11 @@ $(document).ready(function() { - $('.myTable01').fixedHeaderTable({ width: '600', height: '250', footer: true, cloneHeadToFoot: true, altClass: 'odd', themeClass: 'fancyTable', autoShow: false }); + $('.myTable01').fixedHeaderTable({ height: '250', footer: true, cloneHeadToFoot: true, altClass: 'odd', themeClass: 'fancyTable', autoShow: false }); $('.myTable01').fixedHeaderTable('show', 1000); - $('.myTable02').fixedHeaderTable({ width: '600', height: '250', footer: true, altClass: 'odd', themeClass: 'fancyDarkTable' }); + $('.myTable02').fixedHeaderTable({ height: '250', footer: true, altClass: 'odd', themeClass: 'fancyTable' }); - $('.myTable03').fixedHeaderTable({ width: '400', height: '400', altClass: 'odd', footer: true, fixedColumn: true, themeClass: 'fancyTable' }); + $('.myTable03').fixedHeaderTable({ height: '400', altClass: 'odd', footer: true, fixedColumn: true, themeClass: 'fancyTable' }); - $('a.makeTable').bind('click', function() { - - - $('.myTable01').fixedHeaderTable('destroy'); - - $('.myTable01 th, .myTable01 td') - .css('border', $('#border').val() + 'px solid ' + $('#color').val()); - - $('.myTable01').fixedHeaderTable({ width: $('#width').val(), height: $('#height').val(), footer: true, themeClass: 'fancyTable' }); - }); + $('.myTable04').fixedHeaderTable({ height: '400', altClass: 'odd', footer: true, cloneHeadToFoot: true, fixedColumn: true, themeClass: 'fancyTable' }); }); \ No newline at end of file diff --git a/demo/test.html b/demo/test.html index 6e4bc9b..ea86454 100644 --- a/demo/test.html +++ b/demo/test.html @@ -1,4 +1,4 @@ - + FixedHeaderTable Test @@ -11,625 +11,974 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
BrowserVisitsPages/VisitAvg. Time on Site% New VisitsBounce Rate
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
+
+
+ 
+    				
+$('.myTable01').fixedHeaderTable({ 
+	height: '250',
+	footer: true,
+	cloneHeadToFoot: true,
+	altClass: 'odd',
+	themeClass: 'fancyTable',
+	autoShow: false
+});
+    				
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
BrowserVisitsPages/VisitAvg. Time on Site% New VisitsBounce Rate
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
+
+
+
-
+
+
+ 
+        		    				
+$('.myTable02').fixedHeaderTable({
+	height: '250',
+	footer: true,
+	altClass: 'odd',
+	themeClass: 'fancyDarkTable'
+});
+        		    				
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
BrowserVisitsPages/VisitAvg. Time on Site% New VisitsBounce Rate
This is a unique footer12345
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox Web Browser Version 4.01,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
+
+
+
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
BrowserVisitsPages/VisitAvg. Time on Site% New VisitsBounce Rate
This is a unique footer12345
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox Web Browser Version 4.01,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%
+
+
+ 
+        			
+$('.myTable03').fixedHeaderTable({
+	height: '400',
+	altClass: 'odd',
+	footer: true,
+	fixedColumn: true,
+	themeClass: 'fancyTable'
+});
+        			
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
BrowserVisitsPages/VisitAvg. Time on Site% New VisitsBounce RateAvg. Time on Site% New VisitsBounce Rate
Firefox first1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:22 test test test70.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00% test test test32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
+
+
+
-
- -
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
BrowserVisitsPages/VisitAvg. Time on Site% New VisitsBounce RateAvg. Time on Site% New VisitsBounce Rate
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:22 test test test70.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00% test test test32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
+
+
+ 
+        			
+$('.myTable04').fixedHeaderTable({
+	height: '400',
+	altClass: 'odd',
+	footer: true,
+	cloneHeadToFoot: true,
+	fixedColumn: true,
+	themeClass: 'fancyTable'
+});
+        			
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
BrowserVisitsPages/VisitAvg. Time on Site% New VisitsBounce RateAvg. Time on Site% New VisitsBounce Rate
Firefox first1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:22 test test test70.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00% test test test32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
Firefox1,9903.1100:04:2270.00%32.61%00:04:2270.00%32.61%
+
+
\ No newline at end of file From 2c39d6f08920277fa45f108180fe71c1f8fa0628 Mon Sep 17 00:00:00 2001 From: Mark Malek Date: Wed, 18 May 2011 02:58:49 -0400 Subject: [PATCH 06/18] Bug fix: Added vertical-align declaration for default styles. Fixes a bug with rows not aligning with fixed columns --- css/defaultTheme.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/css/defaultTheme.css b/css/defaultTheme.css index 61927f8..ce33d0e 100644 --- a/css/defaultTheme.css +++ b/css/defaultTheme.css @@ -30,7 +30,7 @@ /* text */ font-size: 100%; font: inherit; - vertical-align: baseline; + vertical-align: top; } .fht-table { From 9edaabe5b6ea2459b261f4b448ada512f2a229d3 Mon Sep 17 00:00:00 2001 From: Mark Malek Date: Wed, 18 May 2011 02:59:57 -0400 Subject: [PATCH 07/18] Updated minified version --- jquery.fixedheadertable.min.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/jquery.fixedheadertable.min.js b/jquery.fixedheadertable.min.js index f6ca321..49032cd 100644 --- a/jquery.fixedheadertable.min.js +++ b/jquery.fixedheadertable.min.js @@ -11,10 +11,10 @@ * jQuery authoring guidelines * * Launch : October 2009 -* Version : 1.2.2 +* Version : 1.3 * Released: May 9th, 2011 * * * all CSS sizing (width,height) is done in pixels (px) */ -(function(a){a.fn.fixedHeaderTable=function(f){var e={width:"100%",height:"100%",borderCollapse:true,themeClass:"fht-default",autoShow:true,loader:false,footer:false,cloneHeadToFoot:false,cloneHeaderToFooter:false,autoResize:false,create:null};var c={};var b={init:function(g){c=a.extend({},e,g);return this.each(function(){var i=a(this),h=this;if(d._isTable(i)){b.setup.apply(this,Array.prototype.slice.call(arguments,1));a.isFunction(c.create)&&c.create.call(this)}else{a.error("Invalid table mark-up")}})},setup:function(v){var t=a(this),u=this,m=t.find("thead"),p=t.find("tfoot"),i=t.find("tbody"),k,o,s,j,h,r,n=0;c.scrollbarOffset=d._getScrollbarWidth();c.themeClassName=c.themeClass;if(c.width.search("%")>-1){var q=t.parent().width()-c.scrollbarOffset}else{var q=c.width-c.scrollbarOffset}t.css({width:q});if(!t.closest(".fht-table-wrapper").length){t.addClass("fht-table");t.wrap('
')}k=t.closest(".fht-table-wrapper");k.css({width:c.width,height:c.height}).addClass(c.themeClassName);if(!t.hasClass("fht-table-init")){t.wrap('
')}j=t.closest(".fht-tbody");var g=d._getTableProps(t);d._setupClone(j,g.tbody);if(!t.hasClass("fht-table-init")){o=a('
').prependTo(k);m.clone().appendTo(o.find("table"))}else{o=k.find("div.fht-thead")}d._setupClone(o,g.thead);t.css({"margin-top":-m.outerHeight(true)-g.border});if(c.footer==true){d._setupTableFooter(t,u,g);if(!p.length){p=k.find("div.fht-tfoot table")}n=p.outerHeight(true)}var l=k.height()-m.outerHeight(true)-n-g.border;j.css({height:l});if(!c.autoShow){k.hide()}t.addClass("fht-table-init");if(typeof(c.altClass)!=="undefined"){t.find("tbody tr:odd").addClass(c.altClass)}d._bindScroll(j);return u},resize:function(h){var i=a(this),g=this;return g},show:function(j,i,g){var l=a(this),h=this,k=l.closest(".fht-table-wrapper");if(typeof(j)!=="undefined"&&typeof(j)==="number"){k.show(j,function(){a.isFunction(g)&&g.call(this)});return h}else{if(typeof(j)!=="undefined"&&typeof(j)==="string"&&typeof(i)!=="undefined"&&typeof(i)==="number"){k.show(j,i,function(){a.isFunction(g)&&g.call(this)});return h}}l.closest(".fht-table-wrapper").show();a.isFunction(g)&&g.call(this);return h},hide:function(j,i,g){var l=a(this),h=this,k=l.closest(".fht-table-wrapper");if(typeof(j)!=="undefined"&&typeof(j)==="number"){k.hide(j,function(){a.isFunction(g)&&g.call(this)});return h}else{if(typeof(j)!=="undefined"&&typeof(j)==="string"&&typeof(i)!=="undefined"&&typeof(i)==="number"){k.hide(j,i,function(){a.isFunction(g)&&g.call(this)});return h}}l.closest(".fht-table-wrapper").hide();a.isFunction(g)&&g.call(this);return h},destroy:function(){var i=a(this),g=this,h=i.closest(".fht-table-wrapper");i.insertBefore(h).removeAttr("style").append(h.find("tfoot")).removeClass("fht-table fht-table-init").find(".fht-cell").remove();h.remove();return g}};var d={_isTable:function(k){var j=k,h=j.is("table"),i=j.find("thead").length>0,g=j.find("tbody").length>0;if(h&&i&&g){return true}return false},_bindScroll:function(j){var i=j,h=i.siblings(".fht-thead"),g=i.siblings(".fht-tfoot");i.bind("scroll",function(){h.find("table").css({"margin-left":-this.scrollLeft});if(c.cloneHeadToFoot){g.find("table").css({"margin-left":-this.scrollLeft})}})},_setupTableFooter:function(g,i,h){var m=g,o=i,j=m.closest(".fht-table-wrapper"),l=m.find("tfoot"),n=j.find("div.fht-tfoot");if(!n.length){n=a('
').appendTo(j)}switch(true){case !l.length&&c.cloneHeadToFoot==true&&c.footer==true:var k=j.find("div.fht-thead");n.empty();k.find("table").clone().appendTo(n);break;case l.length&&c.cloneHeadToFoot==false&&c.footer==true:n.find("table").append(l).css({"margin-top":-h.border});d._setupClone(n,h.tfoot);break}},_getTableProps:function(h){var g={thead:{},tbody:{},tfoot:{},border:0};g.border=(h.find("th:first-child").outerWidth()-h.find("th:first-child").innerWidth())/2;h.find("thead tr:first-child th").each(function(i){g.thead[i]=a(this).width()+g.border});h.find("tfoot tr:first-child td").each(function(i){g.tfoot[i]=a(this).width()+g.border});h.find("tbody tr:first-child td").each(function(i){g.tbody[i]=a(this).width()+g.border});return g},_setupClone:function(k,j){var i=k,g=(i.find("thead").length)?"thead th":(i.find("tfoot").length)?"tfoot td":"tbody td",h;i.find(g).each(function(l){h=(a(this).find("div.fht-cell").length)?a(this).find("div.fht-cell"):a('
').appendTo(a(this));h.css({width:parseInt(j[l])});if(!a(this).closest(".fht-tbody").length&&a(this).is(":last-child")){var m=((a(this).innerWidth()-a(this).width())/2)+c.scrollbarOffset;a(this).css({"padding-right":m+"px"})}})},_getScrollbarWidth:function(){var h=0;if(!h){if(a.browser.msie){var j=a('').css({position:"absolute",top:-1000,left:-1000}).appendTo("body"),i=a('').css({position:"absolute",top:-1000,left:-1000}).appendTo("body");h=j.width()-i.width()+2;j.add(i).remove()}else{var g=a("
").css({width:100,height:100,overflow:"auto",position:"absolute",top:-1000,left:-1000}).prependTo("body").append("
").find("div").css({width:"100%",height:200});h=100-g.width();g.parent().remove()}}return h}};if(b[f]){return b[f].apply(this,Array.prototype.slice.call(arguments,1))}else{if(typeof f==="object"||!f){return b.init.apply(this,arguments)}else{a.error('Method "'+f+'" does not exist in fixedHeaderTable plugin!')}}}})(jQuery); \ No newline at end of file +(function(a){a.fn.fixedHeaderTable=function(f){var e={width:"100%",height:"100%",borderCollapse:true,themeClass:"fht-default",fixedColumn:false,autoShow:true,loader:false,footer:false,cloneHeadToFoot:false,autoResize:false,create:null};var c={};var b={init:function(g){c=a.extend({},e,g);return this.each(function(){var i=a(this),h=this;if(d._isTable(i)){b.setup.apply(this,Array.prototype.slice.call(arguments,1));a.isFunction(c.create)&&c.create.call(this)}else{a.error("Invalid table mark-up")}})},setup:function(j){var w=a(this),q=this,p=w.find("thead"),h=w.find("tfoot"),r=w.find("tbody"),u,s,n,x,k,g,v=0;c.includePadding=d._isPaddingIncludedWithWidth();c.scrollbarOffset=d._getScrollbarWidth();c.themeClassName=c.themeClass;if(c.width.search("%")>-1){var i=w.parent().width()-c.scrollbarOffset}else{var i=c.width-c.scrollbarOffset}w.css({width:i});if(!w.closest(".fht-table-wrapper").length){w.addClass("fht-table");w.wrap('
')}u=w.closest(".fht-table-wrapper");if(c.fixedColumn==true&&u.find(".fht-fixed-column").length==0){w.wrap('
');var o=a('
').prependTo(u),t=u.find(".fht-fixed-body")}u.css({width:c.width,height:c.height}).addClass(c.themeClassName);if(!w.hasClass("fht-table-init")){w.wrap('
')}x=w.closest(".fht-tbody");var l=d._getTableProps(w);d._setupClone(x,l.tbody);if(!w.hasClass("fht-table-init")){if(c.fixedColumn==true){s=a('
').prependTo(t)}else{s=a('
').prependTo(u)}p.clone().appendTo(s.find("table"))}else{s=u.find("div.fht-thead")}d._setupClone(s,l.thead);w.css({"margin-top":-s.outerHeight(true)});if(c.footer==true){d._setupTableFooter(w,q,l);if(!h.length){h=u.find("div.fht-tfoot table")}v=h.outerHeight(true)}var m=u.height()-p.outerHeight(true)-v-l.border;x.css({height:m});w.addClass("fht-table-init");if(typeof(c.altClass)!=="undefined"){w.find("tbody tr:odd").addClass(c.altClass)}if(c.fixedColumn==true){d._setupFixedColumn(w,q,l)}if(!c.autoShow){u.hide()}d._bindScroll(x,l);return q},resize:function(h){var i=a(this),g=this;return g},show:function(j,i,g){var l=a(this),h=this,k=l.closest(".fht-table-wrapper");if(typeof(j)!=="undefined"&&typeof(j)==="number"){k.show(j,function(){a.isFunction(i)&&i.call(this)});return h}else{if(typeof(j)!=="undefined"&&typeof(j)==="string"&&typeof(i)!=="undefined"&&typeof(i)==="number"){k.show(j,i,function(){a.isFunction(g)&&g.call(this)});return h}}l.closest(".fht-table-wrapper").show();a.isFunction(j)&&j.call(this);return h},hide:function(j,i,g){var l=a(this),h=this,k=l.closest(".fht-table-wrapper");if(typeof(j)!=="undefined"&&typeof(j)==="number"){k.hide(j,function(){a.isFunction(g)&&g.call(this)});return h}else{if(typeof(j)!=="undefined"&&typeof(j)==="string"&&typeof(i)!=="undefined"&&typeof(i)==="number"){k.hide(j,i,function(){a.isFunction(g)&&g.call(this)});return h}}l.closest(".fht-table-wrapper").hide();a.isFunction(g)&&g.call(this);return h},destroy:function(){var i=a(this),g=this,h=i.closest(".fht-table-wrapper");i.insertBefore(h).removeAttr("style").append(h.find("tfoot")).removeClass("fht-table fht-table-init").find(".fht-cell").remove();h.remove();return g}};var d={_isTable:function(k){var j=k,h=j.is("table"),i=j.find("thead").length>0,g=j.find("tbody").length>0;if(h&&i&&g){return true}return false},_bindScroll:function(l,g){var k=l,j=k.closest(".fht-table-wrapper"),i=k.siblings(".fht-thead"),h=k.siblings(".fht-tfoot");k.bind("scroll",function(){if(c.fixedColumn==true){var m=j.find(".fht-fixed-column");m.find(".fht-tbody table").css({"margin-top":-k.scrollTop()})}i.find("table").css({"margin-left":-this.scrollLeft});if(c.cloneHeadToFoot){h.find("table").css({"margin-left":-this.scrollLeft})}})},_fixHeightWithCss:function(h,g){if(c.includePadding){h.css({height:h.height()+g.border})}else{h.css({height:h.parent().height()+g.border})}},_fixWidthWithCss:function(h,g){h.css({width:h.width()+g.border})},_setupFixedColumn:function(x,n,j){var v=x,p=n,u=v.closest(".fht-table-wrapper"),t=u.find(".fht-fixed-body"),l=u.find(".fht-fixed-column"),m=a('
'),q=a('
'),g=a('
'),w=t.find(".fht-thead thead tr th:first-child"),s,o=w.outerWidth(true)+j.border,h=u.width(),r=t.find(".fht-tbody").height()-c.scrollbarOffset,i;d._fixHeightWithCss(w,j);d._fixWidthWithCss(w,j);s=t.find("tbody tr td:first-child").each(function(y){d._fixHeightWithCss(a(this),j);d._fixWidthWithCss(a(this),j)});m.appendTo(l).find("tr").append(w.clone());q.appendTo(l).css({"margin-top":-1,height:r+j.border});s.each(function(y){i=a("").appendTo(q.find("tbody"));if(c.altClass&&a(this).parent().hasClass(c.altClass)){i.addClass(c.altClass)}a(this).clone().appendTo(i)});l.css({width:o});t.css({width:h});if(c.footer==true||c.cloneHeadToFoot==true){var k=t.find(".fht-tfoot thead tr th:first-child");d._fixHeightWithCss(k,j);g.appendTo(l).find("tr").append(k.clone());g.css({top:c.scrollbarOffset+j.border})}},_setupTableFooter:function(g,i,h){var m=g,o=i,j=m.closest(".fht-table-wrapper"),l=m.find("tfoot"),n=j.find("div.fht-tfoot");if(!n.length){if(c.fixedColumn==true){n=a('
').appendTo(j.find(".fht-fixed-body"))}else{n=a('
').appendTo(j)}}switch(true){case !l.length&&c.cloneHeadToFoot==true&&c.footer==true:var k=j.find("div.fht-thead");n.empty();k.find("table").clone().appendTo(n);break;case l.length&&c.cloneHeadToFoot==false&&c.footer==true:n.find("table").append(l).css({"margin-top":-h.border});d._setupClone(n,h.tfoot);break}},_getTableProps:function(i){var h={thead:{},tbody:{},tfoot:{},border:0},g=1;if(c.borderCollapse==true){g=2}h.border=(i.find("th:first-child").outerWidth()-i.find("th:first-child").innerWidth())/g;i.find("thead tr:first-child th").each(function(j){h.thead[j]=a(this).width()+h.border});i.find("tfoot tr:first-child td").each(function(j){h.tfoot[j]=a(this).width()+h.border});i.find("tbody tr:first-child td").each(function(j){h.tbody[j]=a(this).width()+h.border});return h},_setupClone:function(k,j){var i=k,g=(i.find("thead").length)?"thead th":(i.find("tfoot").length)?"tfoot td":"tbody td",h;i.find(g).each(function(l){h=(a(this).find("div.fht-cell").length)?a(this).find("div.fht-cell"):a('
').appendTo(a(this));h.css({width:parseInt(j[l])});if(!a(this).closest(".fht-tbody").length&&a(this).is(":last-child")&&!a(this).closest(".fht-fixed-column").length){var m=((a(this).innerWidth()-a(this).width())/2)+c.scrollbarOffset;a(this).css({"padding-right":m+"px"})}})},_isPaddingIncludedWithWidth:function(){var i=a('
test
'),h,g;i.appendTo("body");h=i.find("td").height();i.find("td").css("height",i.find("tr").height());g=i.find("td").height();i.remove();if(h!=g){return true}else{return false}},_getScrollbarWidth:function(){var h=0;if(!h){if(a.browser.msie){var j=a('').css({position:"absolute",top:-1000,left:-1000}).appendTo("body"),i=a('').css({position:"absolute",top:-1000,left:-1000}).appendTo("body");h=j.width()-i.width()+2;j.add(i).remove()}else{var g=a("
").css({width:100,height:100,overflow:"auto",position:"absolute",top:-1000,left:-1000}).prependTo("body").append("
").find("div").css({width:"100%",height:200});h=100-g.width();g.parent().remove()}}return h}};if(b[f]){return b[f].apply(this,Array.prototype.slice.call(arguments,1))}else{if(typeof f==="object"||!f){return b.init.apply(this,arguments)}else{a.error('Method "'+f+'" does not exist in fixedHeaderTable plugin!')}}}})(jQuery); \ No newline at end of file From b0e028a41864a1b1bdeee19c9074fb4ad9b2a017 Mon Sep 17 00:00:00 2001 From: Mark Malek Date: Wed, 18 May 2011 18:38:24 -0400 Subject: [PATCH 08/18] Updated version in comments --- css/defaultTheme.css | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/css/defaultTheme.css b/css/defaultTheme.css index ce33d0e..f473c6c 100644 --- a/css/defaultTheme.css +++ b/css/defaultTheme.css @@ -6,10 +6,16 @@ * * Licensed under MIT * http://www.opensource.org/licenses/mit-license.php +* +* http://docs.jquery.com/Plugins/Authoring +* jQuery authoring guidelines * * Launch : October 2009 -* Version : 1.2 -* Released: TBA +* Version : 1.3 +* Released: May 9th, 2011 +* +* +* all CSS sizing (width,height) is done in pixels (px) */ /* @group Reset */ From b9bea2a88382cac4d3abddb175d052764d4a4871 Mon Sep 17 00:00:00 2001 From: Mark Malek Date: Wed, 18 May 2011 18:43:43 -0400 Subject: [PATCH 09/18] Updated ReadMe with fixedColumn option --- README.md | 1 + 1 file changed, 1 insertion(+) diff --git a/README.md b/README.md index a145cc6..61b2863 100644 --- a/README.md +++ b/README.md @@ -11,6 +11,7 @@ * width - Number - Default: 100% * height - Number - Default: 100% +* fixedColumn - Boolean - Default: false * footer - Boolean - Default: false * cloneHeadToFoot - Boolean - Default: false * autoShow - Boolean - Default: true From c30fe94be0e30995c74dd681e99b290b64c5d86f Mon Sep 17 00:00:00 2001 From: Mark Malek Date: Sat, 28 May 2011 02:47:35 -0400 Subject: [PATCH 10/18] Minor refactoring Updated minified version Created a new public method for adding alt rows css class names --- jquery.fixedheadertable.js | 53 +++++++++++++++++++++++----------- jquery.fixedheadertable.min.js | 2 +- 2 files changed, 37 insertions(+), 18 deletions(-) diff --git a/jquery.fixedheadertable.js b/jquery.fixedheadertable.js index bb59cd1..aed7e15 100644 --- a/jquery.fixedheadertable.js +++ b/jquery.fixedheadertable.js @@ -25,18 +25,19 @@ // plugin's default options var defaults = { - width: '100%', - height: '100%', - borderCollapse: true, - themeClass: 'fht-default', + width: '100%', + height: '100%', + themeClass: 'fht-default', - fixedColumn: false, // fixed first column - autoShow: true, // hide table after its created - loader: false, - footer: false, // show footer - cloneHeadToFoot: false, // clone head and use as footer - autoResize: false, // resize table if its parent wrapper changes size - create: null // callback after plugin completes + borderCollapse: true, + fixedColumn: false, // fixed first column + sortable: false, + autoShow: true, // hide table after its created + footer: false, // show footer + cloneHeadToFoot: false, // clone head and use as footer + autoResize: false, // resize table if its parent wrapper changes size + + create: null // callback after plugin completes } @@ -172,8 +173,7 @@ $self.addClass('fht-table-init'); if ( typeof(settings.altClass) !== 'undefined' ) { - $self.find('tbody tr:odd') - .addClass(settings.altClass); + methods.altRows.apply( self ); } if ( settings.fixedColumn == true ) { @@ -200,6 +200,19 @@ return self; }, + /* + * Add CSS class to alternating rows + */ + altRows: function( arg1 ) { + var $self = $(this), + self = this, + altClass = ( typeof(arg1) !== 'undefined' ) ? arg1 : settings.altClass; + + $self.closest('.fht-table-wrapper') + .find('tbody tr:odd:not(:hidden)') + .addClass(altClass); + }, + /* * Show a hidden fixedHeaderTable table */ @@ -367,9 +380,15 @@ * return void */ _fixWidthWithCss: function( $obj, tableProps ) { - $obj.css({ - 'width': $obj.width() + tableProps.border - }); + if ( settings.includePadding ) { + $obj.css({ + 'width': $obj.width() + tableProps.border + }); + } else { + $obj.css({ + 'width': $obj.parent().width() + tableProps.border + }); + } }, /* @@ -440,7 +459,7 @@ .find('tr') .append($firstTdFootChild.clone()); $tfoot.css({ - 'top': settings.scrollbarOffset + tableProps.border + 'top': settings.scrollbarOffset }); } }, diff --git a/jquery.fixedheadertable.min.js b/jquery.fixedheadertable.min.js index 49032cd..fe771d8 100644 --- a/jquery.fixedheadertable.min.js +++ b/jquery.fixedheadertable.min.js @@ -17,4 +17,4 @@ * * all CSS sizing (width,height) is done in pixels (px) */ -(function(a){a.fn.fixedHeaderTable=function(f){var e={width:"100%",height:"100%",borderCollapse:true,themeClass:"fht-default",fixedColumn:false,autoShow:true,loader:false,footer:false,cloneHeadToFoot:false,autoResize:false,create:null};var c={};var b={init:function(g){c=a.extend({},e,g);return this.each(function(){var i=a(this),h=this;if(d._isTable(i)){b.setup.apply(this,Array.prototype.slice.call(arguments,1));a.isFunction(c.create)&&c.create.call(this)}else{a.error("Invalid table mark-up")}})},setup:function(j){var w=a(this),q=this,p=w.find("thead"),h=w.find("tfoot"),r=w.find("tbody"),u,s,n,x,k,g,v=0;c.includePadding=d._isPaddingIncludedWithWidth();c.scrollbarOffset=d._getScrollbarWidth();c.themeClassName=c.themeClass;if(c.width.search("%")>-1){var i=w.parent().width()-c.scrollbarOffset}else{var i=c.width-c.scrollbarOffset}w.css({width:i});if(!w.closest(".fht-table-wrapper").length){w.addClass("fht-table");w.wrap('
')}u=w.closest(".fht-table-wrapper");if(c.fixedColumn==true&&u.find(".fht-fixed-column").length==0){w.wrap('
');var o=a('
').prependTo(u),t=u.find(".fht-fixed-body")}u.css({width:c.width,height:c.height}).addClass(c.themeClassName);if(!w.hasClass("fht-table-init")){w.wrap('
')}x=w.closest(".fht-tbody");var l=d._getTableProps(w);d._setupClone(x,l.tbody);if(!w.hasClass("fht-table-init")){if(c.fixedColumn==true){s=a('
').prependTo(t)}else{s=a('
').prependTo(u)}p.clone().appendTo(s.find("table"))}else{s=u.find("div.fht-thead")}d._setupClone(s,l.thead);w.css({"margin-top":-s.outerHeight(true)});if(c.footer==true){d._setupTableFooter(w,q,l);if(!h.length){h=u.find("div.fht-tfoot table")}v=h.outerHeight(true)}var m=u.height()-p.outerHeight(true)-v-l.border;x.css({height:m});w.addClass("fht-table-init");if(typeof(c.altClass)!=="undefined"){w.find("tbody tr:odd").addClass(c.altClass)}if(c.fixedColumn==true){d._setupFixedColumn(w,q,l)}if(!c.autoShow){u.hide()}d._bindScroll(x,l);return q},resize:function(h){var i=a(this),g=this;return g},show:function(j,i,g){var l=a(this),h=this,k=l.closest(".fht-table-wrapper");if(typeof(j)!=="undefined"&&typeof(j)==="number"){k.show(j,function(){a.isFunction(i)&&i.call(this)});return h}else{if(typeof(j)!=="undefined"&&typeof(j)==="string"&&typeof(i)!=="undefined"&&typeof(i)==="number"){k.show(j,i,function(){a.isFunction(g)&&g.call(this)});return h}}l.closest(".fht-table-wrapper").show();a.isFunction(j)&&j.call(this);return h},hide:function(j,i,g){var l=a(this),h=this,k=l.closest(".fht-table-wrapper");if(typeof(j)!=="undefined"&&typeof(j)==="number"){k.hide(j,function(){a.isFunction(g)&&g.call(this)});return h}else{if(typeof(j)!=="undefined"&&typeof(j)==="string"&&typeof(i)!=="undefined"&&typeof(i)==="number"){k.hide(j,i,function(){a.isFunction(g)&&g.call(this)});return h}}l.closest(".fht-table-wrapper").hide();a.isFunction(g)&&g.call(this);return h},destroy:function(){var i=a(this),g=this,h=i.closest(".fht-table-wrapper");i.insertBefore(h).removeAttr("style").append(h.find("tfoot")).removeClass("fht-table fht-table-init").find(".fht-cell").remove();h.remove();return g}};var d={_isTable:function(k){var j=k,h=j.is("table"),i=j.find("thead").length>0,g=j.find("tbody").length>0;if(h&&i&&g){return true}return false},_bindScroll:function(l,g){var k=l,j=k.closest(".fht-table-wrapper"),i=k.siblings(".fht-thead"),h=k.siblings(".fht-tfoot");k.bind("scroll",function(){if(c.fixedColumn==true){var m=j.find(".fht-fixed-column");m.find(".fht-tbody table").css({"margin-top":-k.scrollTop()})}i.find("table").css({"margin-left":-this.scrollLeft});if(c.cloneHeadToFoot){h.find("table").css({"margin-left":-this.scrollLeft})}})},_fixHeightWithCss:function(h,g){if(c.includePadding){h.css({height:h.height()+g.border})}else{h.css({height:h.parent().height()+g.border})}},_fixWidthWithCss:function(h,g){h.css({width:h.width()+g.border})},_setupFixedColumn:function(x,n,j){var v=x,p=n,u=v.closest(".fht-table-wrapper"),t=u.find(".fht-fixed-body"),l=u.find(".fht-fixed-column"),m=a('
'),q=a('
'),g=a('
'),w=t.find(".fht-thead thead tr th:first-child"),s,o=w.outerWidth(true)+j.border,h=u.width(),r=t.find(".fht-tbody").height()-c.scrollbarOffset,i;d._fixHeightWithCss(w,j);d._fixWidthWithCss(w,j);s=t.find("tbody tr td:first-child").each(function(y){d._fixHeightWithCss(a(this),j);d._fixWidthWithCss(a(this),j)});m.appendTo(l).find("tr").append(w.clone());q.appendTo(l).css({"margin-top":-1,height:r+j.border});s.each(function(y){i=a("").appendTo(q.find("tbody"));if(c.altClass&&a(this).parent().hasClass(c.altClass)){i.addClass(c.altClass)}a(this).clone().appendTo(i)});l.css({width:o});t.css({width:h});if(c.footer==true||c.cloneHeadToFoot==true){var k=t.find(".fht-tfoot thead tr th:first-child");d._fixHeightWithCss(k,j);g.appendTo(l).find("tr").append(k.clone());g.css({top:c.scrollbarOffset+j.border})}},_setupTableFooter:function(g,i,h){var m=g,o=i,j=m.closest(".fht-table-wrapper"),l=m.find("tfoot"),n=j.find("div.fht-tfoot");if(!n.length){if(c.fixedColumn==true){n=a('
').appendTo(j.find(".fht-fixed-body"))}else{n=a('
').appendTo(j)}}switch(true){case !l.length&&c.cloneHeadToFoot==true&&c.footer==true:var k=j.find("div.fht-thead");n.empty();k.find("table").clone().appendTo(n);break;case l.length&&c.cloneHeadToFoot==false&&c.footer==true:n.find("table").append(l).css({"margin-top":-h.border});d._setupClone(n,h.tfoot);break}},_getTableProps:function(i){var h={thead:{},tbody:{},tfoot:{},border:0},g=1;if(c.borderCollapse==true){g=2}h.border=(i.find("th:first-child").outerWidth()-i.find("th:first-child").innerWidth())/g;i.find("thead tr:first-child th").each(function(j){h.thead[j]=a(this).width()+h.border});i.find("tfoot tr:first-child td").each(function(j){h.tfoot[j]=a(this).width()+h.border});i.find("tbody tr:first-child td").each(function(j){h.tbody[j]=a(this).width()+h.border});return h},_setupClone:function(k,j){var i=k,g=(i.find("thead").length)?"thead th":(i.find("tfoot").length)?"tfoot td":"tbody td",h;i.find(g).each(function(l){h=(a(this).find("div.fht-cell").length)?a(this).find("div.fht-cell"):a('
').appendTo(a(this));h.css({width:parseInt(j[l])});if(!a(this).closest(".fht-tbody").length&&a(this).is(":last-child")&&!a(this).closest(".fht-fixed-column").length){var m=((a(this).innerWidth()-a(this).width())/2)+c.scrollbarOffset;a(this).css({"padding-right":m+"px"})}})},_isPaddingIncludedWithWidth:function(){var i=a('
test
'),h,g;i.appendTo("body");h=i.find("td").height();i.find("td").css("height",i.find("tr").height());g=i.find("td").height();i.remove();if(h!=g){return true}else{return false}},_getScrollbarWidth:function(){var h=0;if(!h){if(a.browser.msie){var j=a('').css({position:"absolute",top:-1000,left:-1000}).appendTo("body"),i=a('').css({position:"absolute",top:-1000,left:-1000}).appendTo("body");h=j.width()-i.width()+2;j.add(i).remove()}else{var g=a("
").css({width:100,height:100,overflow:"auto",position:"absolute",top:-1000,left:-1000}).prependTo("body").append("
").find("div").css({width:"100%",height:200});h=100-g.width();g.parent().remove()}}return h}};if(b[f]){return b[f].apply(this,Array.prototype.slice.call(arguments,1))}else{if(typeof f==="object"||!f){return b.init.apply(this,arguments)}else{a.error('Method "'+f+'" does not exist in fixedHeaderTable plugin!')}}}})(jQuery); \ No newline at end of file +(function(a){a.fn.fixedHeaderTable=function(f){var e={width:"100%",height:"100%",themeClass:"fht-default",borderCollapse:true,fixedColumn:false,sortable:false,autoShow:true,footer:false,cloneHeadToFoot:false,autoResize:false,create:null};var c={};var b={init:function(g){c=a.extend({},e,g);return this.each(function(){var i=a(this),h=this;if(d._isTable(i)){b.setup.apply(this,Array.prototype.slice.call(arguments,1));a.isFunction(c.create)&&c.create.call(this)}else{a.error("Invalid table mark-up")}})},setup:function(j){var w=a(this),q=this,p=w.find("thead"),h=w.find("tfoot"),r=w.find("tbody"),u,s,n,x,k,g,v=0;c.includePadding=d._isPaddingIncludedWithWidth();c.scrollbarOffset=d._getScrollbarWidth();c.themeClassName=c.themeClass;if(c.width.search("%")>-1){var i=w.parent().width()-c.scrollbarOffset}else{var i=c.width-c.scrollbarOffset}w.css({width:i});if(!w.closest(".fht-table-wrapper").length){w.addClass("fht-table");w.wrap('
')}u=w.closest(".fht-table-wrapper");if(c.fixedColumn==true&&u.find(".fht-fixed-column").length==0){w.wrap('
');var o=a('
').prependTo(u),t=u.find(".fht-fixed-body")}u.css({width:c.width,height:c.height}).addClass(c.themeClassName);if(!w.hasClass("fht-table-init")){w.wrap('
')}x=w.closest(".fht-tbody");var l=d._getTableProps(w);d._setupClone(x,l.tbody);if(!w.hasClass("fht-table-init")){if(c.fixedColumn==true){s=a('
').prependTo(t)}else{s=a('
').prependTo(u)}p.clone().appendTo(s.find("table"))}else{s=u.find("div.fht-thead")}d._setupClone(s,l.thead);w.css({"margin-top":-s.outerHeight(true)});if(c.footer==true){d._setupTableFooter(w,q,l);if(!h.length){h=u.find("div.fht-tfoot table")}v=h.outerHeight(true)}var m=u.height()-p.outerHeight(true)-v-l.border;x.css({height:m});w.addClass("fht-table-init");if(typeof(c.altClass)!=="undefined"){b.altRows.apply(q)}if(c.fixedColumn==true){d._setupFixedColumn(w,q,l)}if(!c.autoShow){u.hide()}d._bindScroll(x,l);return q},resize:function(h){var i=a(this),g=this;return g},altRows:function(i){var j=a(this),h=this,g=(typeof(i)!=="undefined")?i:c.altClass;j.closest(".fht-table-wrapper").find("tbody tr:odd:not(:hidden)").addClass(g)},show:function(j,i,g){var l=a(this),h=this,k=l.closest(".fht-table-wrapper");if(typeof(j)!=="undefined"&&typeof(j)==="number"){k.show(j,function(){a.isFunction(i)&&i.call(this)});return h}else{if(typeof(j)!=="undefined"&&typeof(j)==="string"&&typeof(i)!=="undefined"&&typeof(i)==="number"){k.show(j,i,function(){a.isFunction(g)&&g.call(this)});return h}}l.closest(".fht-table-wrapper").show();a.isFunction(j)&&j.call(this);return h},hide:function(j,i,g){var l=a(this),h=this,k=l.closest(".fht-table-wrapper");if(typeof(j)!=="undefined"&&typeof(j)==="number"){k.hide(j,function(){a.isFunction(g)&&g.call(this)});return h}else{if(typeof(j)!=="undefined"&&typeof(j)==="string"&&typeof(i)!=="undefined"&&typeof(i)==="number"){k.hide(j,i,function(){a.isFunction(g)&&g.call(this)});return h}}l.closest(".fht-table-wrapper").hide();a.isFunction(g)&&g.call(this);return h},destroy:function(){var i=a(this),g=this,h=i.closest(".fht-table-wrapper");i.insertBefore(h).removeAttr("style").append(h.find("tfoot")).removeClass("fht-table fht-table-init").find(".fht-cell").remove();h.remove();return g}};var d={_isTable:function(k){var j=k,h=j.is("table"),i=j.find("thead").length>0,g=j.find("tbody").length>0;if(h&&i&&g){return true}return false},_bindScroll:function(l,g){var k=l,j=k.closest(".fht-table-wrapper"),i=k.siblings(".fht-thead"),h=k.siblings(".fht-tfoot");k.bind("scroll",function(){if(c.fixedColumn==true){var m=j.find(".fht-fixed-column");m.find(".fht-tbody table").css({"margin-top":-k.scrollTop()})}i.find("table").css({"margin-left":-this.scrollLeft});if(c.cloneHeadToFoot){h.find("table").css({"margin-left":-this.scrollLeft})}})},_fixHeightWithCss:function(h,g){if(c.includePadding){h.css({height:h.height()+g.border})}else{h.css({height:h.parent().height()+g.border})}},_fixWidthWithCss:function(h,g){if(c.includePadding){h.css({width:h.width()+g.border})}else{h.css({width:h.parent().width()+g.border})}},_setupFixedColumn:function(x,n,j){var v=x,p=n,u=v.closest(".fht-table-wrapper"),t=u.find(".fht-fixed-body"),l=u.find(".fht-fixed-column"),m=a('
'),q=a('
'),g=a('
'),w=t.find(".fht-thead thead tr th:first-child"),s,o=w.outerWidth(true)+j.border,h=u.width(),r=t.find(".fht-tbody").height()-c.scrollbarOffset,i;d._fixHeightWithCss(w,j);d._fixWidthWithCss(w,j);s=t.find("tbody tr td:first-child").each(function(y){d._fixHeightWithCss(a(this),j);d._fixWidthWithCss(a(this),j)});m.appendTo(l).find("tr").append(w.clone());q.appendTo(l).css({"margin-top":-1,height:r+j.border});s.each(function(y){i=a("").appendTo(q.find("tbody"));if(c.altClass&&a(this).parent().hasClass(c.altClass)){i.addClass(c.altClass)}a(this).clone().appendTo(i)});l.css({width:o});t.css({width:h});if(c.footer==true||c.cloneHeadToFoot==true){var k=t.find(".fht-tfoot thead tr th:first-child");d._fixHeightWithCss(k,j);g.appendTo(l).find("tr").append(k.clone());g.css({top:c.scrollbarOffset})}},_setupTableFooter:function(g,i,h){var m=g,o=i,j=m.closest(".fht-table-wrapper"),l=m.find("tfoot"),n=j.find("div.fht-tfoot");if(!n.length){if(c.fixedColumn==true){n=a('
').appendTo(j.find(".fht-fixed-body"))}else{n=a('
').appendTo(j)}}switch(true){case !l.length&&c.cloneHeadToFoot==true&&c.footer==true:var k=j.find("div.fht-thead");n.empty();k.find("table").clone().appendTo(n);break;case l.length&&c.cloneHeadToFoot==false&&c.footer==true:n.find("table").append(l).css({"margin-top":-h.border});d._setupClone(n,h.tfoot);break}},_getTableProps:function(i){var h={thead:{},tbody:{},tfoot:{},border:0},g=1;if(c.borderCollapse==true){g=2}h.border=(i.find("th:first-child").outerWidth()-i.find("th:first-child").innerWidth())/g;i.find("thead tr:first-child th").each(function(j){h.thead[j]=a(this).width()+h.border});i.find("tfoot tr:first-child td").each(function(j){h.tfoot[j]=a(this).width()+h.border});i.find("tbody tr:first-child td").each(function(j){h.tbody[j]=a(this).width()+h.border});return h},_setupClone:function(k,j){var i=k,g=(i.find("thead").length)?"thead th":(i.find("tfoot").length)?"tfoot td":"tbody td",h;i.find(g).each(function(l){h=(a(this).find("div.fht-cell").length)?a(this).find("div.fht-cell"):a('
').appendTo(a(this));h.css({width:parseInt(j[l])});if(!a(this).closest(".fht-tbody").length&&a(this).is(":last-child")&&!a(this).closest(".fht-fixed-column").length){var m=((a(this).innerWidth()-a(this).width())/2)+c.scrollbarOffset;a(this).css({"padding-right":m+"px"})}})},_isPaddingIncludedWithWidth:function(){var i=a('
test
'),h,g;i.appendTo("body");h=i.find("td").height();i.find("td").css("height",i.find("tr").height());g=i.find("td").height();i.remove();if(h!=g){return true}else{return false}},_getScrollbarWidth:function(){var h=0;if(!h){if(a.browser.msie){var j=a('').css({position:"absolute",top:-1000,left:-1000}).appendTo("body"),i=a('').css({position:"absolute",top:-1000,left:-1000}).appendTo("body");h=j.width()-i.width()+2;j.add(i).remove()}else{var g=a("
").css({width:100,height:100,overflow:"auto",position:"absolute",top:-1000,left:-1000}).prependTo("body").append("
").find("div").css({width:"100%",height:200});h=100-g.width();g.parent().remove()}}return h}};if(b[f]){return b[f].apply(this,Array.prototype.slice.call(arguments,1))}else{if(typeof f==="object"||!f){return b.init.apply(this,arguments)}else{a.error('Method "'+f+'" does not exist in fixedHeaderTable plugin!')}}}})(jQuery); \ No newline at end of file From cb3cf6724206c60fbf92390b3925a46b5eec563f Mon Sep 17 00:00:00 2001 From: Tad Fisher Date: Mon, 1 Aug 2011 07:43:06 -1000 Subject: [PATCH 11/18] support multiple fixed columns - use {'fixedColumns': n} --- jquery.fixedheadertable.js | 634 +++++++++++++++++++------------------ 1 file changed, 323 insertions(+), 311 deletions(-) diff --git a/jquery.fixedheadertable.js b/jquery.fixedheadertable.js index aed7e15..61b3fb9 100644 --- a/jquery.fixedheadertable.js +++ b/jquery.fixedheadertable.js @@ -1,22 +1,22 @@ /*! -* jquery.fixedHeaderTable. The jQuery fixedHeaderTable plugin -* -* Copyright (c) 2011 Mark Malek -* http://fixedheadertable.com -* -* Licensed under MIT -* http://www.opensource.org/licenses/mit-license.php -* -* http://docs.jquery.com/Plugins/Authoring -* jQuery authoring guidelines -* -* Launch : October 2009 -* Version : 1.3 -* Released: May 9th, 2011 -* -* -* all CSS sizing (width,height) is done in pixels (px) -*/ + * jquery.fixedHeaderTable. The jQuery fixedHeaderTable plugin + * + * Copyright (c) 2011 Mark Malek + * http://fixedheadertable.com + * + * Licensed under MIT + * http://www.opensource.org/licenses/mit-license.php + * + * http://docs.jquery.com/Plugins/Authoring + * jQuery authoring guidelines + * + * Launch : October 2009 + * Version : 1.3 + * Released: May 9th, 2011 + * + * + * all CSS sizing (width,height) is done in pixels (px) + */ (function($) { @@ -30,11 +30,11 @@ themeClass: 'fht-default', borderCollapse: true, - fixedColumn: false, // fixed first column + fixedColumns: 0, // fixed first columns sortable: false, autoShow: true, // hide table after its created footer: false, // show footer - cloneHeadToFoot: false, // clone head and use as footer + cloneHeadToFoot: false, // clone head and use as footer autoResize: false, // resize table if its parent wrapper changes size create: null // callback after plugin completes @@ -54,7 +54,7 @@ return this.each(function() { var $self = $(this), // reference the jQuery version of the current DOM element - self = this; // reference to the actual DOM element + self = this; // reference to the actual DOM element if ( helpers._isTable($self) ) { methods.setup.apply(this, Array.prototype.slice.call(arguments, 1)); @@ -67,38 +67,38 @@ }); }, - - /* - * Setup table structure for fixed headers and optional footer - */ + + /* + * Setup table structure for fixed headers and optional footer + */ setup: function( options ) { var $self = $(this), - self = this, - $thead = $self.find('thead'), - $tfoot = $self.find('tfoot'), - $tbody = $self.find('tbody'), - $wrapper, - $divHead, - $divFoot, - $divBody, - $fixedHeadRow, - $temp, - tfootHeight = 0; + self = this, + $thead = $self.find('thead'), + $tfoot = $self.find('tfoot'), + $tbody = $self.find('tbody'), + $wrapper, + $divHead, + $divFoot, + $divBody, + $fixedHeadRow, + $temp, + tfootHeight = 0; settings.includePadding = helpers._isPaddingIncludedWithWidth(); settings.scrollbarOffset = helpers._getScrollbarWidth(); - settings.themeClassName = settings.themeClass; - - if ( settings.width.search('%') > -1 ) { - var widthMinusScrollbar = $self.parent().width() - settings.scrollbarOffset; - } else { - var widthMinusScrollbar = settings.width - settings.scrollbarOffset; - } - + settings.themeClassName = settings.themeClass; + + if ( settings.width.search('%') > -1 ) { + var widthMinusScrollbar = $self.parent().width() - settings.scrollbarOffset; + } else { + var widthMinusScrollbar = settings.width - settings.scrollbarOffset; + } + $self.css({ - width: widthMinusScrollbar - }); - + width: widthMinusScrollbar + }); + if ( !$self.closest('.fht-table-wrapper').length ) { $self.addClass('fht-table'); @@ -107,40 +107,40 @@ $wrapper = $self.closest('.fht-table-wrapper'); - if ( settings.fixedColumn == true && $wrapper.find('.fht-fixed-column').length == 0 ) { - $self.wrap('
'); - - var $fixedColumn = $('
').prependTo($wrapper), - $fixedBody = $wrapper.find('.fht-fixed-body'); + if ( settings.fixedColumns > 0 && $wrapper.find('.fht-fixed-column').length == 0 ) { + $self.wrap('
'); + + var $fixedColumns = $('
').prependTo($wrapper), + $fixedBody = $wrapper.find('.fht-fixed-body'); } $wrapper.css({ - width: settings.width, - height: settings.height - }) - .addClass(settings.themeClassName); + width: settings.width, + height: settings.height + }) + .addClass(settings.themeClassName); if ( !$self.hasClass('fht-table-init') ) { $self.wrap('
'); - + } - $divBody = $self.closest('.fht-tbody'); - + $divBody = $self.closest('.fht-tbody'); + var tableProps = helpers._getTableProps($self); helpers._setupClone( $divBody, tableProps.tbody ); if ( !$self.hasClass('fht-table-init') ) { - if ( settings.fixedColumn == true ) { - $divHead = $('
').prependTo($fixedBody); - } else { - $divHead = $('
').prependTo($wrapper); - } + if ( settings.fixedColumns > 0 ) { + $divHead = $('
').prependTo($fixedBody); + } else { + $divHead = $('
').prependTo($wrapper); + } $thead.clone().appendTo($divHead.find('table')); } else { - $divHead = $wrapper.find('div.fht-thead'); + $divHead = $wrapper.find('div.fht-thead'); } helpers._setupClone( $divHead, tableProps.thead ); @@ -155,29 +155,29 @@ */ if ( settings.footer == true ) { - helpers._setupTableFooter( $self, self, tableProps ); - - if ( !$tfoot.length ) { - $tfoot = $wrapper.find('div.fht-tfoot table'); - } - - tfootHeight = $tfoot.outerHeight(true); + helpers._setupTableFooter( $self, self, tableProps ); + + if ( !$tfoot.length ) { + $tfoot = $wrapper.find('div.fht-tfoot table'); + } + + tfootHeight = $tfoot.outerHeight(true); } var tbodyHeight = $wrapper.height() - $thead.outerHeight(true) - tfootHeight - tableProps.border; $divBody.css({ - 'height': tbodyHeight - }); + 'height': tbodyHeight + }); $self.addClass('fht-table-init'); if ( typeof(settings.altClass) !== 'undefined' ) { - methods.altRows.apply( self ); + methods.altRows.apply( self ); } - if ( settings.fixedColumn == true ) { - helpers._setupFixedColumn( $self, self, tableProps ); + if ( settings.fixedColumns > 0 ) { + helpers._setupFixedColumn( $self, self, tableProps ); } if ( !settings.autoShow ) { @@ -195,7 +195,7 @@ */ resize: function( options ) { var $self = $(this), - self = this; + self = this; return self; }, @@ -205,12 +205,12 @@ */ altRows: function( arg1 ) { var $self = $(this), - self = this, - altClass = ( typeof(arg1) !== 'undefined' ) ? arg1 : settings.altClass; + self = this, + altClass = ( typeof(arg1) !== 'undefined' ) ? arg1 : settings.altClass; $self.closest('.fht-table-wrapper') - .find('tbody tr:odd:not(:hidden)') - .addClass(altClass); + .find('tbody tr:odd:not(:hidden)') + .addClass(altClass); }, /* @@ -218,33 +218,33 @@ */ show: function( arg1, arg2, arg3 ) { var $self = $(this), - self = this, - $wrapper = $self.closest('.fht-table-wrapper'); + self = this, + $wrapper = $self.closest('.fht-table-wrapper'); - // User provided show duration without a specific effect + // User provided show duration without a specific effect if ( typeof(arg1) !== 'undefined' && typeof(arg1) === 'number' ) { - - $wrapper.show(arg1, function() { - $.isFunction(arg2) && arg2.call(this); - }); + + $wrapper.show(arg1, function() { + $.isFunction(arg2) && arg2.call(this); + }); - return self; - + return self; + } else if ( typeof(arg1) !== 'undefined' && typeof(arg1) === 'string' - && typeof(arg2) !== 'undefined' && typeof(arg2) === 'number' ) { - // User provided show duration with an effect - - $wrapper.show(arg1, arg2, function() { - $.isFunction(arg3) && arg3.call(this); - }); - - return self; - + && typeof(arg2) !== 'undefined' && typeof(arg2) === 'number' ) { + // User provided show duration with an effect + + $wrapper.show(arg1, arg2, function() { + $.isFunction(arg3) && arg3.call(this); + }); + + return self; + } - + $self.closest('.fht-table-wrapper') - .show(); - $.isFunction(arg1) && arg1.call(this); + .show(); + $.isFunction(arg1) && arg1.call(this); return self; }, @@ -254,33 +254,33 @@ */ hide: function( arg1, arg2, arg3 ) { var $self = $(this), - self = this, - $wrapper = $self.closest('.fht-table-wrapper'); - + self = this, + $wrapper = $self.closest('.fht-table-wrapper'); + // User provided show duration without a specific effect if ( typeof(arg1) !== 'undefined' && typeof(arg1) === 'number' ) { - $wrapper.hide(arg1, function() { - $.isFunction(arg3) && arg3.call(this); - }); - - return self; - } else if ( typeof(arg1) !== 'undefined' && typeof(arg1) === 'string' - && typeof(arg2) !== 'undefined' && typeof(arg2) === 'number' ) { - - $wrapper.hide(arg1, arg2, function() { - $.isFunction(arg3) && arg3.call(this); - }); - - return self; - } + $wrapper.hide(arg1, function() { + $.isFunction(arg3) && arg3.call(this); + }); - $self.closest('.fht-table-wrapper') - .hide(); - - $.isFunction(arg3) && arg3.call(this); - + return self; + } else if ( typeof(arg1) !== 'undefined' && typeof(arg1) === 'string' + && typeof(arg2) !== 'undefined' && typeof(arg2) === 'number' ) { + + $wrapper.hide(arg1, arg2, function() { + $.isFunction(arg3) && arg3.call(this); + }); + + return self; + } + + $self.closest('.fht-table-wrapper') + .hide(); + + $.isFunction(arg3) && arg3.call(this); + + - return self; }, @@ -289,15 +289,15 @@ */ destroy: function() { var $self = $(this), - self = this, - $wrapper = $self.closest('.fht-table-wrapper'); - + self = this, + $wrapper = $self.closest('.fht-table-wrapper'); + $self.insertBefore($wrapper) - .removeAttr('style') - .append($wrapper.find('tfoot')) - .removeClass('fht-table fht-table-init') - .find('.fht-cell') - .remove(); + .removeAttr('style') + .append($wrapper.find('tfoot')) + .removeClass('fht-table fht-table-init') + .find('.fht-cell') + .remove(); $wrapper.remove(); @@ -309,15 +309,15 @@ // private methods var helpers = { - /* - * return boolean - * True if a thead and tbody exist. - */ + /* + * return boolean + * True if a thead and tbody exist. + */ _isTable: function( $obj ) { var $self = $obj, - hasTable = $self.is('table'), - hasThead = $self.find('thead').length > 0, - hasTbody = $self.find('tbody').length > 0; + hasTable = $self.is('table'), + hasThead = $self.find('thead').length > 0, + hasTbody = $self.find('tbody').length > 0; if ( hasTable && hasThead && hasTbody ) { return true; @@ -333,31 +333,31 @@ */ _bindScroll: function( $obj, tableProps ) { var $self = $obj, - $wrapper = $self.closest('.fht-table-wrapper'), - $thead = $self.siblings('.fht-thead'), - $tfoot = $self.siblings('.fht-tfoot'); + $wrapper = $self.closest('.fht-table-wrapper'), + $thead = $self.siblings('.fht-thead'), + $tfoot = $self.siblings('.fht-tfoot'); $self.bind('scroll', function() { - if ( settings.fixedColumn == true ) { - var $fixedColumn = $wrapper.find('.fht-fixed-column'); + if ( settings.fixedColumns > 0 ) { + var $fixedColumns = $wrapper.find('.fht-fixed-column'); - $fixedColumn.find('.fht-tbody table') + $fixedColumns.find('.fht-tbody table') .css({ 'margin-top': -$self.scrollTop() - }); + }); } - $thead.find('table') - .css({ - 'margin-left': -this.scrollLeft - }); - - if ( settings.cloneHeadToFoot ) { - $tfoot.find('table') - .css({ - 'margin-left': -this.scrollLeft - }); - } + $thead.find('table') + .css({ + 'margin-left': -this.scrollLeft + }); + + if ( settings.cloneHeadToFoot ) { + $tfoot.find('table') + .css({ + 'margin-left': -this.scrollLeft + }); + } }); }, @@ -366,13 +366,13 @@ */ _fixHeightWithCss: function ( $obj, tableProps ) { if ( settings.includePadding ) { - $obj.css({ - 'height': $obj.height() + tableProps.border - }); + $obj.css({ + 'height': $obj.height() + tableProps.border + }); } else { - $obj.css({ - 'height': $obj.parent().height() + tableProps.border - }); + $obj.css({ + 'height': $obj.parent().height() + tableProps.border + }); } }, @@ -381,88 +381,100 @@ */ _fixWidthWithCss: function( $obj, tableProps ) { if ( settings.includePadding ) { - $obj.css({ - 'width': $obj.width() + tableProps.border - }); + $obj.css({ + 'width': $obj.width() + tableProps.border + }); } else { - $obj.css({ - 'width': $obj.parent().width() + tableProps.border - }); + $obj.css({ + 'width': $obj.parent().width() + tableProps.border + }); } }, /* * return void */ - _setupFixedColumn: function ( $obj, obj, tableProps ) { - var $self = $obj, - self = obj, - $wrapper = $self.closest('.fht-table-wrapper'), - $fixedBody = $wrapper.find('.fht-fixed-body'), - $fixedColumn = $wrapper.find('.fht-fixed-column'), - $thead = $('
'), - $tbody = $('
'), - $tfoot = $('
'), - $firstThChild = $fixedBody.find('.fht-thead thead tr th:first-child'), - $firstTdChildren, - fixedColumnWidth = $firstThChild.outerWidth(true) + tableProps.border, - fixedBodyWidth = $wrapper.width(), - fixedBodyHeight = $fixedBody.find('.fht-tbody').height() - settings.scrollbarOffset, - $newRow; - - // Fix cell heights - helpers._fixHeightWithCss( $firstThChild, tableProps ); - helpers._fixWidthWithCss( $firstThChild, tableProps ); - $firstTdChildren = $fixedBody.find('tbody tr td:first-child') - .each( function(index) { - helpers._fixHeightWithCss( $(this), tableProps ); - helpers._fixWidthWithCss( $(this), tableProps ); - }); - - // clone header - $thead.appendTo($fixedColumn) - .find('tr') - .append($firstThChild.clone()); - - $tbody.appendTo($fixedColumn) - .css({ - 'margin-top': -1, - 'height': fixedBodyHeight + tableProps.border - }); - $firstTdChildren.each(function(index) { - $newRow = $('').appendTo($tbody.find('tbody')); - - if ( settings.altClass && $(this).parent().hasClass(settings.altClass) ) { - $newRow.addClass(settings.altClass); - } - - $(this).clone() - .appendTo($newRow); - }); - - // set width of fixed column wrapper - $fixedColumn.css({ - 'width': fixedColumnWidth - }); - - // set width of body table wrapper - $fixedBody.css({ - 'width': fixedBodyWidth - }); - - // setup clone footer with fixed column - if ( settings.footer == true || settings.cloneHeadToFoot == true ) { - var $firstTdFootChild = $fixedBody.find('.fht-tfoot thead tr th:first-child'); - - helpers._fixHeightWithCss( $firstTdFootChild, tableProps ); - $tfoot.appendTo($fixedColumn) - .find('tr') - .append($firstTdFootChild.clone()); - $tfoot.css({ - 'top': settings.scrollbarOffset - }); - } - }, + _setupFixedColumn: function ( $obj, obj, tableProps ) { + var $self = $obj, + self = obj, + $wrapper = $self.closest('.fht-table-wrapper'), + $fixedBody = $wrapper.find('.fht-fixed-body'), + $fixedColumn = $wrapper.find('.fht-fixed-column'), + $thead = $('
'), + $tbody = $('
'), + $tfoot = $('
'), + $firstThChildren,// = $fixedBody.find('.fht-thead thead tr th:first-child'), + $firstTdChildren, + fixedColumnWidth,// = $firstThChild.outerWidth(true) + tableProps.border, + fixedBodyWidth = $wrapper.width(), + fixedBodyHeight = $fixedBody.find('.fht-tbody').height() - settings.scrollbarOffset, + $newRow; + + $firstThChildren = $fixedBody.find('.fht-thead thead tr th:lt(' + settings.fixedColumns + ')'); + fixedColumnWidth = settings.fixedColumns * tableProps.border; + $firstThChildren.each(function(index) { + fixedColumnWidth += $(this).outerWidth(true); + }); + + // Fix cell heights + helpers._fixHeightWithCss( $firstThChildren, tableProps ); + helpers._fixWidthWithCss( $firstThChildren, tableProps ); + + firstTdChildrenSelector = 'tbody tr td:not(:nth-child(n+' + (settings.fixedColumns + 1) + '))'; + $firstTdChildren = $fixedBody.find(firstTdChildrenSelector) + .each( function(index) { + helpers._fixHeightWithCss( $(this), tableProps ); + helpers._fixWidthWithCss( $(this), tableProps ); + }); + + // clone header + $thead.appendTo($fixedColumn) + .find('tr') + .append($firstThChildren.clone()); + + $tbody.appendTo($fixedColumn) + .css({ + 'margin-top': -1, + 'height': fixedBodyHeight + tableProps.border + }); + + var $newRow; + $firstTdChildren.each(function(index) { + if (index % settings.fixedColumns == 0) { + $newRow = $('').appendTo($tbody.find('tbody')); + + if ( settings.altClass && $(this).parent().hasClass(settings.altClass) ) { + $newRow.addClass(settings.altClass); + } + } + + $(this).clone() + .appendTo($newRow); + }); + + // set width of fixed column wrapper + $fixedColumn.css({ + 'width': fixedColumnWidth + }); + + // set width of body table wrapper + $fixedBody.css({ + 'width': fixedBodyWidth + }); + + // setup clone footer with fixed column + if ( settings.footer == true || settings.cloneHeadToFoot == true ) { + var $firstTdFootChild = $fixedBody.find('.fht-tfoot thead tr th:lt(' + settings.fixedColumns + ')'); + + helpers._fixHeightWithCss( $firstTdFootChild, tableProps ); + $tfoot.appendTo($fixedColumn) + .find('tr') + .append($firstTdFootChild.clone()); + $tfoot.css({ + 'top': settings.scrollbarOffset + }); + } + }, /* * return void @@ -470,41 +482,41 @@ _setupTableFooter: function ( $obj, obj, tableProps ) { var $self = $obj, - self = obj, - $wrapper = $self.closest('.fht-table-wrapper'), - $tfoot = $self.find('tfoot'), - $divFoot = $wrapper.find('div.fht-tfoot'); - + self = obj, + $wrapper = $self.closest('.fht-table-wrapper'), + $tfoot = $self.find('tfoot'), + $divFoot = $wrapper.find('div.fht-tfoot'); + if ( !$divFoot.length ) { - if ( settings.fixedColumn == true ) { - $divFoot = $('
').appendTo($wrapper.find('.fht-fixed-body')); - } else { - $divFoot = $('
').appendTo($wrapper); - } + if ( settings.fixedColumns > 0 ) { + $divFoot = $('
').appendTo($wrapper.find('.fht-fixed-body')); + } else { + $divFoot = $('
').appendTo($wrapper); + } } switch (true) { - case !$tfoot.length && settings.cloneHeadToFoot == true && settings.footer == true: - - var $divHead = $wrapper.find('div.fht-thead'); - - $divFoot.empty(); - $divHead.find('table') - .clone() - .appendTo($divFoot); - - break; - case $tfoot.length && settings.cloneHeadToFoot == false && settings.footer == true: - - $divFoot.find('table') - .append($tfoot) - .css({ - 'margin-top': -tableProps.border - }); - - helpers._setupClone( $divFoot, tableProps.tfoot ); - - break; + case !$tfoot.length && settings.cloneHeadToFoot == true && settings.footer == true: + + var $divHead = $wrapper.find('div.fht-thead'); + + $divFoot.empty(); + $divHead.find('table') + .clone() + .appendTo($divFoot); + + break; + case $tfoot.length && settings.cloneHeadToFoot == false && settings.footer == true: + + $divFoot.find('table') + .append($tfoot) + .css({ + 'margin-top': -tableProps.border + }); + + helpers._setupClone( $divFoot, tableProps.tfoot ); + + break; } }, @@ -524,17 +536,17 @@ borderCollapse = 1; if ( settings.borderCollapse == true ) { - borderCollapse = 2; + borderCollapse = 2; } - - tableProp.border = ( $obj.find('th:first-child').outerWidth() - $obj.find('th:first-child').innerWidth() ) / borderCollapse; - + + tableProp.border = ( $obj.find('th:first-child').outerWidth() - $obj.find('th:first-child').innerWidth() ) / borderCollapse; + $obj.find('thead tr:first-child th').each(function(index) { tableProp.thead[index] = $(this).width() + tableProp.border; }); $obj.find('tfoot tr:first-child td').each(function(index) { - tableProp.tfoot[index] = $(this).width() + tableProp.border; + tableProp.tfoot[index] = $(this).width() + tableProp.border; }); $obj.find('tbody tr:first-child td').each(function(index) { @@ -550,16 +562,16 @@ */ _setupClone: function( $obj, cellArray ) { var $self = $obj, - selector = ( $self.find('thead').length ) ? - 'thead th' : - ( $self.find('tfoot').length ) ? - 'tfoot td' : - 'tbody td', - $cell; + selector = ( $self.find('thead').length ) ? + 'thead th' : + ( $self.find('tfoot').length ) ? + 'tfoot td' : + 'tbody td', + $cell; $self.find(selector).each(function(index) { $cell = ( $(this).find('div.fht-cell').length ) ? $(this).find('div.fht-cell') : $('
').appendTo($(this)); - + $cell.css({ 'width': parseInt(cellArray[index]) }); @@ -571,7 +583,7 @@ if ( !$(this).closest('.fht-tbody').length && $(this).is(':last-child') && !$(this).closest('.fht-fixed-column').length ) { var padding = ( ( $(this).innerWidth() - $(this).width() ) / 2 ) + settings.scrollbarOffset; $(this).css({ - 'padding-right': padding + 'px' + 'padding-right': padding + 'px' }); } }); @@ -585,23 +597,23 @@ */ _isPaddingIncludedWithWidth: function() { var $obj = $('
test
'), - defaultHeight, - newHeight; - + defaultHeight, + newHeight; + $obj.appendTo('body'); defaultHeight = $obj.find('td').height(); $obj.find('td') - .css('height', $obj.find('tr').height()); - + .css('height', $obj.find('tr').height()); + newHeight = $obj.find('td').height(); $obj.remove(); if ( defaultHeight != newHeight ) { - return true; + return true; } else { - return false; + return false; } }, @@ -614,24 +626,24 @@ var scrollbarWidth = 0; if ( !scrollbarWidth ) { - if ( $.browser.msie ) { - var $textarea1 = $('') - .css({ position: 'absolute', top: -1000, left: -1000 }).appendTo('body'), - $textarea2 = $('') - .css({ position: 'absolute', top: -1000, left: -1000 }).appendTo('body'); - scrollbarWidth = $textarea1.width() - $textarea2.width() + 2; // + 2 for border offset - $textarea1.add($textarea2).remove(); - } else { - var $div = $('
') - .css({ width: 100, height: 100, overflow: 'auto', position: 'absolute', top: -1000, left: -1000 }) - .prependTo('body').append('
').find('div') - .css({ width: '100%', height: 200 }); - scrollbarWidth = 100 - $div.width(); - $div.parent().remove(); - } - } - - return scrollbarWidth; + if ( $.browser.msie ) { + var $textarea1 = $('') + .css({ position: 'absolute', top: -1000, left: -1000 }).appendTo('body'), + $textarea2 = $('') + .css({ position: 'absolute', top: -1000, left: -1000 }).appendTo('body'); + scrollbarWidth = $textarea1.width() - $textarea2.width() + 2; // + 2 for border offset + $textarea1.add($textarea2).remove(); + } else { + var $div = $('
') + .css({ width: 100, height: 100, overflow: 'auto', position: 'absolute', top: -1000, left: -1000 }) + .prependTo('body').append('
').find('div') + .css({ width: '100%', height: 200 }); + scrollbarWidth = 100 - $div.width(); + $div.parent().remove(); + } + } + + return scrollbarWidth; } } @@ -643,13 +655,13 @@ // call the respective method return methods[method].apply(this, Array.prototype.slice.call(arguments, 1)); - // if an object is given as method OR nothing is given as argument + // if an object is given as method OR nothing is given as argument } else if ( typeof method === 'object' || !method ) { // call the initialization method return methods.init.apply(this, arguments); - // otherwise + // otherwise } else { // trigger an error From 3e498d9f680a6370a3bb311dc4ed2abc30b65628 Mon Sep 17 00:00:00 2001 From: Tad Fisher Date: Mon, 1 Aug 2011 07:53:22 -1000 Subject: [PATCH 12/18] Updated tests for multiple-fixed-columns --- README.md | 2 +- demo/demo.js | 2 +- demo/test.html | 4 ++-- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/README.md b/README.md index 61b2863..db8921f 100644 --- a/README.md +++ b/README.md @@ -11,7 +11,7 @@ * width - Number - Default: 100% * height - Number - Default: 100% -* fixedColumn - Boolean - Default: false +* fixedColumns - Number - Default: 0 * footer - Boolean - Default: false * cloneHeadToFoot - Boolean - Default: false * autoShow - Boolean - Default: true diff --git a/demo/demo.js b/demo/demo.js index eb253d0..2ed6bf0 100644 --- a/demo/demo.js +++ b/demo/demo.js @@ -7,5 +7,5 @@ $(document).ready(function() { $('.myTable03').fixedHeaderTable({ height: '400', altClass: 'odd', footer: true, fixedColumn: true, themeClass: 'fancyTable' }); - $('.myTable04').fixedHeaderTable({ height: '400', altClass: 'odd', footer: true, cloneHeadToFoot: true, fixedColumn: true, themeClass: 'fancyTable' }); + $('.myTable04').fixedHeaderTable({ height: '400', altClass: 'odd', footer: true, cloneHeadToFoot: true, fixedColumns: 3, themeClass: 'fancyTable' }); }); \ No newline at end of file diff --git a/demo/test.html b/demo/test.html index ea86454..45b2fb6 100644 --- a/demo/test.html +++ b/demo/test.html @@ -689,7 +689,7 @@ $('.myTable04').fixedHeaderTable({ altClass: 'odd', footer: true, cloneHeadToFoot: true, - fixedColumn: true, + fixedColumn: 3, themeClass: 'fancyTable' }); @@ -981,4 +981,4 @@ $('.myTable04').fixedHeaderTable({
- \ No newline at end of file + From 973aa1118d777f7501cc9d3cea98fc2771b84ae5 Mon Sep 17 00:00:00 2001 From: Tad Fisher Date: Mon, 1 Aug 2011 08:13:15 -1000 Subject: [PATCH 13/18] Correct fixed-column widths, make horizontal scrollbar selectable --- jquery.fixedheadertable.js | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) diff --git a/jquery.fixedheadertable.js b/jquery.fixedheadertable.js index 61b3fb9..2a0bf89 100644 --- a/jquery.fixedheadertable.js +++ b/jquery.fixedheadertable.js @@ -381,12 +381,16 @@ */ _fixWidthWithCss: function( $obj, tableProps ) { if ( settings.includePadding ) { - $obj.css({ - 'width': $obj.width() + tableProps.border + $obj.each(function(index) { + $(this).css({ + 'width': $(this).width() + tableProps.border + }); }); } else { - $obj.css({ - 'width': $obj.parent().width() + tableProps.border + $obj.each(function(index) { + $(this).css({ + 'width': $(this).parent().width() + tableProps.border + }); }); } }, @@ -454,6 +458,7 @@ // set width of fixed column wrapper $fixedColumn.css({ + 'height': 0, 'width': fixedColumnWidth }); From 2ef1314562d00d5370738143c7da3ba1277ae2f6 Mon Sep 17 00:00:00 2001 From: Tad Fisher Date: Mon, 1 Aug 2011 09:12:58 -1000 Subject: [PATCH 14/18] Fix column widths on FF3.x --- jquery.fixedheadertable.js | 18 ++++++++++++------ 1 file changed, 12 insertions(+), 6 deletions(-) diff --git a/jquery.fixedheadertable.js b/jquery.fixedheadertable.js index 2a0bf89..4edd956 100644 --- a/jquery.fixedheadertable.js +++ b/jquery.fixedheadertable.js @@ -379,20 +379,21 @@ /* * return void */ - _fixWidthWithCss: function( $obj, tableProps ) { + _fixWidthWithCss: function( $obj, tableProps, width ) { if ( settings.includePadding ) { $obj.each(function(index) { $(this).css({ - 'width': $(this).width() + tableProps.border + 'width': width == undefined ? $(this).width() + tableProps.border : width + tableProps.border }); - }); + }); } else { $obj.each(function(index) { $(this).css({ - 'width': $(this).parent().width() + tableProps.border + 'width': width == undefined ? $(this).parent().width() + tableProps.border : width + tableProps.border }); }); } + }, /* @@ -424,11 +425,16 @@ helpers._fixHeightWithCss( $firstThChildren, tableProps ); helpers._fixWidthWithCss( $firstThChildren, tableProps ); + var tdWidths = []; + $firstThChildren.each(function(index) { + tdWidths.push($(this).width()); + }); + firstTdChildrenSelector = 'tbody tr td:not(:nth-child(n+' + (settings.fixedColumns + 1) + '))'; $firstTdChildren = $fixedBody.find(firstTdChildrenSelector) .each( function(index) { - helpers._fixHeightWithCss( $(this), tableProps ); - helpers._fixWidthWithCss( $(this), tableProps ); + helpers._fixHeightWithCss( $(this), tableProps); + helpers._fixWidthWithCss( $(this), tableProps, tdWidths[index % settings.fixedColumns] ); }); // clone header From 291a96905c8680b774e78f2b8999c7676afe0059 Mon Sep 17 00:00:00 2001 From: Tad Fisher Date: Mon, 1 Aug 2011 10:06:36 -1000 Subject: [PATCH 15/18] Respond to mousewheel on fixed columns --- jquery.fixedheadertable.js | 13 +++++++++++++ lib/jquery.mousewheel.min.js | 12 ++++++++++++ 2 files changed, 25 insertions(+) create mode 100644 lib/jquery.mousewheel.min.js diff --git a/jquery.fixedheadertable.js b/jquery.fixedheadertable.js index 4edd956..ae4e81d 100644 --- a/jquery.fixedheadertable.js +++ b/jquery.fixedheadertable.js @@ -466,7 +466,20 @@ $fixedColumn.css({ 'height': 0, 'width': fixedColumnWidth + }) + + + // bind mousewheel events + var maxTop = $fixedColumn.find('.fht-tbody .fht-table').height() - $fixedColumn.find('.fht-tbody').height(); + console.log(maxTop); + $fixedColumn.find('.fht-table').bind('mousewheel', function(event, delta) { + var top = parseInt($(this).css('marginTop'), 10) + (delta > 0 ? 40 : -40); + if (top > 0) top = 0; + if (top < -maxTop) top = -maxTop; + $(this).css('marginTop', top); + $fixedBody.find('.fht-tbody').scrollTop(-top); }); + // set width of body table wrapper $fixedBody.css({ diff --git a/lib/jquery.mousewheel.min.js b/lib/jquery.mousewheel.min.js new file mode 100644 index 0000000..a17391e --- /dev/null +++ b/lib/jquery.mousewheel.min.js @@ -0,0 +1,12 @@ +/* Copyright (c) 2010 Brandon Aaron (http://brandonaaron.net) + * Licensed under the MIT License (LICENSE.txt). + * + * Thanks to: http://adomas.org/javascript-mouse-wheel/ for some pointers. + * Thanks to: Mathias Bank(http://www.mathias-bank.de) for a scope bug fix. + * Thanks to: Seamus Leahy for adding deltaX and deltaY + * + * Version: 3.0.4 + * + * Requires: 1.2.2+ + */ +(function(c){var a=["DOMMouseScroll","mousewheel"];c.event.special.mousewheel={setup:function(){if(this.addEventListener){for(var d=a.length;d;){this.addEventListener(a[--d],b,false)}}else{this.onmousewheel=b}},teardown:function(){if(this.removeEventListener){for(var d=a.length;d;){this.removeEventListener(a[--d],b,false)}}else{this.onmousewheel=null}}};c.fn.extend({mousewheel:function(d){return d?this.bind("mousewheel",d):this.trigger("mousewheel")},unmousewheel:function(d){return this.unbind("mousewheel",d)}});function b(i){var g=i||window.event,f=[].slice.call(arguments,1),j=0,h=true,e=0,d=0;i=c.event.fix(g);i.type="mousewheel";if(i.wheelDelta){j=i.wheelDelta/120}if(i.detail){j=-i.detail/3}d=j;if(g.axis!==undefined&&g.axis===g.HORIZONTAL_AXIS){d=0;e=-1*j}if(g.wheelDeltaY!==undefined){d=g.wheelDeltaY/120}if(g.wheelDeltaX!==undefined){e=-1*g.wheelDeltaX/120}f.unshift(i,j,e,d);return c.event.handle.apply(this,f)}})(jQuery); \ No newline at end of file From 2d437b3ff94825fe092005a623097a9c4eb7e75e Mon Sep 17 00:00:00 2001 From: Tad Fisher Date: Mon, 1 Aug 2011 10:21:40 -1000 Subject: [PATCH 16/18] formatting, add mousewheel to minified dist --- jquery.fixedheadertable.js | 51 ++++++++++++++-------------------- jquery.fixedheadertable.min.js | 40 +++++++++++++------------- 2 files changed, 41 insertions(+), 50 deletions(-) diff --git a/jquery.fixedheadertable.js b/jquery.fixedheadertable.js index ae4e81d..82453b9 100644 --- a/jquery.fixedheadertable.js +++ b/jquery.fixedheadertable.js @@ -18,54 +18,45 @@ * all CSS sizing (width,height) is done in pixels (px) */ -(function($) { +(function ($) { - $.fn.fixedHeaderTable = function( method ) { + $.fn.fixedHeaderTable = function (method) { // plugin's default options var defaults = { - width: '100%', - height: '100%', - themeClass: 'fht-default', - - borderCollapse: true, - fixedColumns: 0, // fixed first columns - sortable: false, - autoShow: true, // hide table after its created - footer: false, // show footer - cloneHeadToFoot: false, // clone head and use as footer - autoResize: false, // resize table if its parent wrapper changes size - - create: null // callback after plugin completes - - } + width: '100%', + height: '100%', + themeClass: 'fht-default', + borderCollapse: true, + fixedColumns: 0, // fixed first columns + sortable: false, + autoShow: true, // hide table after its created + footer: false, // show footer + cloneHeadToFoot: false, // clone head and use as footer + autoResize: false, // resize table if its parent wrapper changes size + create: null // callback after plugin completes + }; - var settings = {} + var settings = {}; // public methods var methods = { - - init : function(options) { - + init: function (options) { settings = $.extend({}, defaults, options); // iterate through all the DOM elements we are attaching the plugin to - return this.each(function() { - + return this.each(function () { var $self = $(this), // reference the jQuery version of the current DOM element self = this; // reference to the actual DOM element if ( helpers._isTable($self) ) { methods.setup.apply(this, Array.prototype.slice.call(arguments, 1)); - $.isFunction(settings.create) && settings.create.call(this); } else { - $.error('Invalid table mark-up'); - } - + $.error('Invalid table mark-up'); + } }); - }, /* @@ -452,7 +443,7 @@ $firstTdChildren.each(function(index) { if (index % settings.fixedColumns == 0) { $newRow = $('').appendTo($tbody.find('tbody')); - + if ( settings.altClass && $(this).parent().hasClass(settings.altClass) ) { $newRow.addClass(settings.altClass); } @@ -693,6 +684,6 @@ } - } + }; })(jQuery); \ No newline at end of file diff --git a/jquery.fixedheadertable.min.js b/jquery.fixedheadertable.min.js index fe771d8..1784b40 100644 --- a/jquery.fixedheadertable.min.js +++ b/jquery.fixedheadertable.min.js @@ -1,20 +1,20 @@ -/*! -* jquery.fixedHeaderTable. The jQuery fixedHeaderTable plugin -* -* Copyright (c) 2011 Mark Malek -* http://fixedheadertable.com -* -* Licensed under MIT -* http://www.opensource.org/licenses/mit-license.php -* -* http://docs.jquery.com/Plugins/Authoring -* jQuery authoring guidelines -* -* Launch : October 2009 -* Version : 1.3 -* Released: May 9th, 2011 -* -* -* all CSS sizing (width,height) is done in pixels (px) -*/ -(function(a){a.fn.fixedHeaderTable=function(f){var e={width:"100%",height:"100%",themeClass:"fht-default",borderCollapse:true,fixedColumn:false,sortable:false,autoShow:true,footer:false,cloneHeadToFoot:false,autoResize:false,create:null};var c={};var b={init:function(g){c=a.extend({},e,g);return this.each(function(){var i=a(this),h=this;if(d._isTable(i)){b.setup.apply(this,Array.prototype.slice.call(arguments,1));a.isFunction(c.create)&&c.create.call(this)}else{a.error("Invalid table mark-up")}})},setup:function(j){var w=a(this),q=this,p=w.find("thead"),h=w.find("tfoot"),r=w.find("tbody"),u,s,n,x,k,g,v=0;c.includePadding=d._isPaddingIncludedWithWidth();c.scrollbarOffset=d._getScrollbarWidth();c.themeClassName=c.themeClass;if(c.width.search("%")>-1){var i=w.parent().width()-c.scrollbarOffset}else{var i=c.width-c.scrollbarOffset}w.css({width:i});if(!w.closest(".fht-table-wrapper").length){w.addClass("fht-table");w.wrap('
')}u=w.closest(".fht-table-wrapper");if(c.fixedColumn==true&&u.find(".fht-fixed-column").length==0){w.wrap('
');var o=a('
').prependTo(u),t=u.find(".fht-fixed-body")}u.css({width:c.width,height:c.height}).addClass(c.themeClassName);if(!w.hasClass("fht-table-init")){w.wrap('
')}x=w.closest(".fht-tbody");var l=d._getTableProps(w);d._setupClone(x,l.tbody);if(!w.hasClass("fht-table-init")){if(c.fixedColumn==true){s=a('
').prependTo(t)}else{s=a('
').prependTo(u)}p.clone().appendTo(s.find("table"))}else{s=u.find("div.fht-thead")}d._setupClone(s,l.thead);w.css({"margin-top":-s.outerHeight(true)});if(c.footer==true){d._setupTableFooter(w,q,l);if(!h.length){h=u.find("div.fht-tfoot table")}v=h.outerHeight(true)}var m=u.height()-p.outerHeight(true)-v-l.border;x.css({height:m});w.addClass("fht-table-init");if(typeof(c.altClass)!=="undefined"){b.altRows.apply(q)}if(c.fixedColumn==true){d._setupFixedColumn(w,q,l)}if(!c.autoShow){u.hide()}d._bindScroll(x,l);return q},resize:function(h){var i=a(this),g=this;return g},altRows:function(i){var j=a(this),h=this,g=(typeof(i)!=="undefined")?i:c.altClass;j.closest(".fht-table-wrapper").find("tbody tr:odd:not(:hidden)").addClass(g)},show:function(j,i,g){var l=a(this),h=this,k=l.closest(".fht-table-wrapper");if(typeof(j)!=="undefined"&&typeof(j)==="number"){k.show(j,function(){a.isFunction(i)&&i.call(this)});return h}else{if(typeof(j)!=="undefined"&&typeof(j)==="string"&&typeof(i)!=="undefined"&&typeof(i)==="number"){k.show(j,i,function(){a.isFunction(g)&&g.call(this)});return h}}l.closest(".fht-table-wrapper").show();a.isFunction(j)&&j.call(this);return h},hide:function(j,i,g){var l=a(this),h=this,k=l.closest(".fht-table-wrapper");if(typeof(j)!=="undefined"&&typeof(j)==="number"){k.hide(j,function(){a.isFunction(g)&&g.call(this)});return h}else{if(typeof(j)!=="undefined"&&typeof(j)==="string"&&typeof(i)!=="undefined"&&typeof(i)==="number"){k.hide(j,i,function(){a.isFunction(g)&&g.call(this)});return h}}l.closest(".fht-table-wrapper").hide();a.isFunction(g)&&g.call(this);return h},destroy:function(){var i=a(this),g=this,h=i.closest(".fht-table-wrapper");i.insertBefore(h).removeAttr("style").append(h.find("tfoot")).removeClass("fht-table fht-table-init").find(".fht-cell").remove();h.remove();return g}};var d={_isTable:function(k){var j=k,h=j.is("table"),i=j.find("thead").length>0,g=j.find("tbody").length>0;if(h&&i&&g){return true}return false},_bindScroll:function(l,g){var k=l,j=k.closest(".fht-table-wrapper"),i=k.siblings(".fht-thead"),h=k.siblings(".fht-tfoot");k.bind("scroll",function(){if(c.fixedColumn==true){var m=j.find(".fht-fixed-column");m.find(".fht-tbody table").css({"margin-top":-k.scrollTop()})}i.find("table").css({"margin-left":-this.scrollLeft});if(c.cloneHeadToFoot){h.find("table").css({"margin-left":-this.scrollLeft})}})},_fixHeightWithCss:function(h,g){if(c.includePadding){h.css({height:h.height()+g.border})}else{h.css({height:h.parent().height()+g.border})}},_fixWidthWithCss:function(h,g){if(c.includePadding){h.css({width:h.width()+g.border})}else{h.css({width:h.parent().width()+g.border})}},_setupFixedColumn:function(x,n,j){var v=x,p=n,u=v.closest(".fht-table-wrapper"),t=u.find(".fht-fixed-body"),l=u.find(".fht-fixed-column"),m=a('
'),q=a('
'),g=a('
'),w=t.find(".fht-thead thead tr th:first-child"),s,o=w.outerWidth(true)+j.border,h=u.width(),r=t.find(".fht-tbody").height()-c.scrollbarOffset,i;d._fixHeightWithCss(w,j);d._fixWidthWithCss(w,j);s=t.find("tbody tr td:first-child").each(function(y){d._fixHeightWithCss(a(this),j);d._fixWidthWithCss(a(this),j)});m.appendTo(l).find("tr").append(w.clone());q.appendTo(l).css({"margin-top":-1,height:r+j.border});s.each(function(y){i=a("").appendTo(q.find("tbody"));if(c.altClass&&a(this).parent().hasClass(c.altClass)){i.addClass(c.altClass)}a(this).clone().appendTo(i)});l.css({width:o});t.css({width:h});if(c.footer==true||c.cloneHeadToFoot==true){var k=t.find(".fht-tfoot thead tr th:first-child");d._fixHeightWithCss(k,j);g.appendTo(l).find("tr").append(k.clone());g.css({top:c.scrollbarOffset})}},_setupTableFooter:function(g,i,h){var m=g,o=i,j=m.closest(".fht-table-wrapper"),l=m.find("tfoot"),n=j.find("div.fht-tfoot");if(!n.length){if(c.fixedColumn==true){n=a('
').appendTo(j.find(".fht-fixed-body"))}else{n=a('
').appendTo(j)}}switch(true){case !l.length&&c.cloneHeadToFoot==true&&c.footer==true:var k=j.find("div.fht-thead");n.empty();k.find("table").clone().appendTo(n);break;case l.length&&c.cloneHeadToFoot==false&&c.footer==true:n.find("table").append(l).css({"margin-top":-h.border});d._setupClone(n,h.tfoot);break}},_getTableProps:function(i){var h={thead:{},tbody:{},tfoot:{},border:0},g=1;if(c.borderCollapse==true){g=2}h.border=(i.find("th:first-child").outerWidth()-i.find("th:first-child").innerWidth())/g;i.find("thead tr:first-child th").each(function(j){h.thead[j]=a(this).width()+h.border});i.find("tfoot tr:first-child td").each(function(j){h.tfoot[j]=a(this).width()+h.border});i.find("tbody tr:first-child td").each(function(j){h.tbody[j]=a(this).width()+h.border});return h},_setupClone:function(k,j){var i=k,g=(i.find("thead").length)?"thead th":(i.find("tfoot").length)?"tfoot td":"tbody td",h;i.find(g).each(function(l){h=(a(this).find("div.fht-cell").length)?a(this).find("div.fht-cell"):a('
').appendTo(a(this));h.css({width:parseInt(j[l])});if(!a(this).closest(".fht-tbody").length&&a(this).is(":last-child")&&!a(this).closest(".fht-fixed-column").length){var m=((a(this).innerWidth()-a(this).width())/2)+c.scrollbarOffset;a(this).css({"padding-right":m+"px"})}})},_isPaddingIncludedWithWidth:function(){var i=a('
test
'),h,g;i.appendTo("body");h=i.find("td").height();i.find("td").css("height",i.find("tr").height());g=i.find("td").height();i.remove();if(h!=g){return true}else{return false}},_getScrollbarWidth:function(){var h=0;if(!h){if(a.browser.msie){var j=a('').css({position:"absolute",top:-1000,left:-1000}).appendTo("body"),i=a('').css({position:"absolute",top:-1000,left:-1000}).appendTo("body");h=j.width()-i.width()+2;j.add(i).remove()}else{var g=a("
").css({width:100,height:100,overflow:"auto",position:"absolute",top:-1000,left:-1000}).prependTo("body").append("
").find("div").css({width:"100%",height:200});h=100-g.width();g.parent().remove()}}return h}};if(b[f]){return b[f].apply(this,Array.prototype.slice.call(arguments,1))}else{if(typeof f==="object"||!f){return b.init.apply(this,arguments)}else{a.error('Method "'+f+'" does not exist in fixedHeaderTable plugin!')}}}})(jQuery); \ No newline at end of file + +(function(c){var a=["DOMMouseScroll","mousewheel"];c.event.special.mousewheel={setup:function(){if(this.addEventListener){for(var d=a.length;d;){this.addEventListener(a[--d],b,false)}}else{this.onmousewheel=b}},teardown:function(){if(this.removeEventListener){for(var d=a.length;d;){this.removeEventListener(a[--d],b,false)}}else{this.onmousewheel=null}}};c.fn.extend({mousewheel:function(d){return d?this.bind("mousewheel",d):this.trigger("mousewheel")},unmousewheel:function(d){return this.unbind("mousewheel",d)}});function b(i){var g=i||window.event,f=[].slice.call(arguments,1),j=0,h=true,e=0,d=0;i=c.event.fix(g);i.type="mousewheel";if(i.wheelDelta){j=i.wheelDelta/120}if(i.detail){j=-i.detail/3}d=j;if(g.axis!==undefined&&g.axis===g.HORIZONTAL_AXIS){d=0;e=-1*j}if(g.wheelDeltaY!==undefined){d=g.wheelDeltaY/120}if(g.wheelDeltaX!==undefined){e=-1*g.wheelDeltaX/120}f.unshift(i,j,e,d);return c.event.handle.apply(this,f)}})(jQuery);/*! + jquery.fixedHeaderTable. The jQuery fixedHeaderTable plugin + + Copyright (c) 2011 Mark Malek + http://fixedheadertable.com + + Licensed under MIT + http://www.opensource.org/licenses/mit-license.php + + http://docs.jquery.com/Plugins/Authoring + jQuery authoring guidelines + + Launch : October 2009 + Version : 1.3 + Released: May 9th, 2011 + + + all CSS sizing (width,height) is done in pixels (px) + */(function($){$.fn.fixedHeaderTable=function(method){var defaults={width:'100%',height:'100%',themeClass:'fht-default',borderCollapse:true,fixedColumns:0,sortable:false,autoShow:true,footer:false,cloneHeadToFoot:false,autoResize:false,create:null};var settings={};var methods={init:function(options){settings=$.extend({},defaults,options);return this.each(function(){var $self=$(this),self=this;if(helpers._isTable($self)){methods.setup.apply(this,Array.prototype.slice.call(arguments,1));$.isFunction(settings.create)&&settings.create.call(this);}else{$.error('Invalid table mark-up');}});},setup:function(options){var $self=$(this),self=this,$thead=$self.find('thead'),$tfoot=$self.find('tfoot'),$tbody=$self.find('tbody'),$wrapper,$divHead,$divFoot,$divBody,$fixedHeadRow,$temp,tfootHeight=0;settings.includePadding=helpers._isPaddingIncludedWithWidth();settings.scrollbarOffset=helpers._getScrollbarWidth();settings.themeClassName=settings.themeClass;if(settings.width.search('%')>-1){var widthMinusScrollbar=$self.parent().width()-settings.scrollbarOffset;}else{var widthMinusScrollbar=settings.width-settings.scrollbarOffset;}$self.css({width:widthMinusScrollbar});if(!$self.closest('.fht-table-wrapper').length){$self.addClass('fht-table');$self.wrap('
');}$wrapper=$self.closest('.fht-table-wrapper');if(settings.fixedColumns>0&&$wrapper.find('.fht-fixed-column').length==0){$self.wrap('
');var $fixedColumns=$('
').prependTo($wrapper),$fixedBody=$wrapper.find('.fht-fixed-body');}$wrapper.css({width:settings.width,height:settings.height}).addClass(settings.themeClassName);if(!$self.hasClass('fht-table-init')){$self.wrap('
');}$divBody=$self.closest('.fht-tbody');var tableProps=helpers._getTableProps($self);helpers._setupClone($divBody,tableProps.tbody);if(!$self.hasClass('fht-table-init')){if(settings.fixedColumns>0){$divHead=$('
').prependTo($fixedBody);}else{$divHead=$('
').prependTo($wrapper);}$thead.clone().appendTo($divHead.find('table'));}else{$divHead=$wrapper.find('div.fht-thead');}helpers._setupClone($divHead,tableProps.thead);$self.css({'margin-top':-$divHead.outerHeight(true)});if(settings.footer==true){helpers._setupTableFooter($self,self,tableProps);if(!$tfoot.length){$tfoot=$wrapper.find('div.fht-tfoot table');}tfootHeight=$tfoot.outerHeight(true);}var tbodyHeight=$wrapper.height()-$thead.outerHeight(true)-tfootHeight-tableProps.border;$divBody.css({'height':tbodyHeight});$self.addClass('fht-table-init');if(typeof(settings.altClass)!=='undefined'){methods.altRows.apply(self);}if(settings.fixedColumns>0){helpers._setupFixedColumn($self,self,tableProps);}if(!settings.autoShow){$wrapper.hide();}helpers._bindScroll($divBody,tableProps);return self;},resize:function(options){var $self=$(this),self=this;return self;},altRows:function(arg1){var $self=$(this),self=this,altClass=(typeof(arg1)!=='undefined')?arg1:settings.altClass;$self.closest('.fht-table-wrapper').find('tbody tr:odd:not(:hidden)').addClass(altClass);},show:function(arg1,arg2,arg3){var $self=$(this),self=this,$wrapper=$self.closest('.fht-table-wrapper');if(typeof(arg1)!=='undefined'&&typeof(arg1)==='number'){$wrapper.show(arg1,function(){$.isFunction(arg2)&&arg2.call(this);});return self;}else if(typeof(arg1)!=='undefined'&&typeof(arg1)==='string'&&typeof(arg2)!=='undefined'&&typeof(arg2)==='number'){$wrapper.show(arg1,arg2,function(){$.isFunction(arg3)&&arg3.call(this);});return self;}$self.closest('.fht-table-wrapper').show();$.isFunction(arg1)&&arg1.call(this);return self;},hide:function(arg1,arg2,arg3){var $self=$(this),self=this,$wrapper=$self.closest('.fht-table-wrapper');if(typeof(arg1)!=='undefined'&&typeof(arg1)==='number'){$wrapper.hide(arg1,function(){$.isFunction(arg3)&&arg3.call(this);});return self;}else if(typeof(arg1)!=='undefined'&&typeof(arg1)==='string'&&typeof(arg2)!=='undefined'&&typeof(arg2)==='number'){$wrapper.hide(arg1,arg2,function(){$.isFunction(arg3)&&arg3.call(this);});return self;}$self.closest('.fht-table-wrapper').hide();$.isFunction(arg3)&&arg3.call(this);return self;},destroy:function(){var $self=$(this),self=this,$wrapper=$self.closest('.fht-table-wrapper');$self.insertBefore($wrapper).removeAttr('style').append($wrapper.find('tfoot')).removeClass('fht-table fht-table-init').find('.fht-cell').remove();$wrapper.remove();return self;}}var helpers={_isTable:function($obj){var $self=$obj,hasTable=$self.is('table'),hasThead=$self.find('thead').length>0,hasTbody=$self.find('tbody').length>0;if(hasTable&&hasThead&&hasTbody){return true;}return false;},_bindScroll:function($obj,tableProps){var $self=$obj,$wrapper=$self.closest('.fht-table-wrapper'),$thead=$self.siblings('.fht-thead'),$tfoot=$self.siblings('.fht-tfoot');$self.bind('scroll',function(){if(settings.fixedColumns>0){var $fixedColumns=$wrapper.find('.fht-fixed-column');$fixedColumns.find('.fht-tbody table').css({'margin-top':-$self.scrollTop()});}$thead.find('table').css({'margin-left':-this.scrollLeft});if(settings.cloneHeadToFoot){$tfoot.find('table').css({'margin-left':-this.scrollLeft});}});},_fixHeightWithCss:function($obj,tableProps){if(settings.includePadding){$obj.css({'height':$obj.height()+tableProps.border});}else{$obj.css({'height':$obj.parent().height()+tableProps.border});}},_fixWidthWithCss:function($obj,tableProps,width){if(settings.includePadding){$obj.each(function(index){$(this).css({'width':width==undefined?$(this).width()+tableProps.border:width+tableProps.border});});}else{$obj.each(function(index){$(this).css({'width':width==undefined?$(this).parent().width()+tableProps.border:width+tableProps.border});});}},_setupFixedColumn:function($obj,obj,tableProps){var $self=$obj,self=obj,$wrapper=$self.closest('.fht-table-wrapper'),$fixedBody=$wrapper.find('.fht-fixed-body'),$fixedColumn=$wrapper.find('.fht-fixed-column'),$thead=$('
'),$tbody=$('
'),$tfoot=$('
'),$firstThChildren,$firstTdChildren,fixedColumnWidth,fixedBodyWidth=$wrapper.width(),fixedBodyHeight=$fixedBody.find('.fht-tbody').height()-settings.scrollbarOffset,$newRow;$firstThChildren=$fixedBody.find('.fht-thead thead tr th:lt('+settings.fixedColumns+')');fixedColumnWidth=settings.fixedColumns*tableProps.border;$firstThChildren.each(function(index){fixedColumnWidth+=$(this).outerWidth(true);});helpers._fixHeightWithCss($firstThChildren,tableProps);helpers._fixWidthWithCss($firstThChildren,tableProps);var tdWidths=[];$firstThChildren.each(function(index){tdWidths.push($(this).width());});firstTdChildrenSelector='tbody tr td:not(:nth-child(n+'+(settings.fixedColumns+1)+'))';$firstTdChildren=$fixedBody.find(firstTdChildrenSelector).each(function(index){helpers._fixHeightWithCss($(this),tableProps);helpers._fixWidthWithCss($(this),tableProps,tdWidths[index%settings.fixedColumns]);});$thead.appendTo($fixedColumn).find('tr').append($firstThChildren.clone());$tbody.appendTo($fixedColumn).css({'margin-top':-1,'height':fixedBodyHeight+tableProps.border});var $newRow;$firstTdChildren.each(function(index){if(index%settings.fixedColumns==0){$newRow=$('').appendTo($tbody.find('tbody'));if(settings.altClass&&$(this).parent().hasClass(settings.altClass)){$newRow.addClass(settings.altClass);}}$(this).clone().appendTo($newRow);});$fixedColumn.css({'height':0,'width':fixedColumnWidth})var maxTop=$fixedColumn.find('.fht-tbody .fht-table').height()-$fixedColumn.find('.fht-tbody').height();console.log(maxTop);$fixedColumn.find('.fht-table').bind('mousewheel',function(event,delta){var top=parseInt($(this).css('marginTop'),10)+(delta>0?40:-40);if(top>0)top=0;if(top<-maxTop)top=-maxTop;$(this).css('marginTop',top);$fixedBody.find('.fht-tbody').scrollTop(-top);});$fixedBody.css({'width':fixedBodyWidth});if(settings.footer==true||settings.cloneHeadToFoot==true){var $firstTdFootChild=$fixedBody.find('.fht-tfoot thead tr th:lt('+settings.fixedColumns+')');helpers._fixHeightWithCss($firstTdFootChild,tableProps);$tfoot.appendTo($fixedColumn).find('tr').append($firstTdFootChild.clone());$tfoot.css({'top':settings.scrollbarOffset});}},_setupTableFooter:function($obj,obj,tableProps){var $self=$obj,self=obj,$wrapper=$self.closest('.fht-table-wrapper'),$tfoot=$self.find('tfoot'),$divFoot=$wrapper.find('div.fht-tfoot');if(!$divFoot.length){if(settings.fixedColumns>0){$divFoot=$('
').appendTo($wrapper.find('.fht-fixed-body'));}else{$divFoot=$('
').appendTo($wrapper);}}switch(true){case!$tfoot.length&&settings.cloneHeadToFoot==true&&settings.footer==true:var $divHead=$wrapper.find('div.fht-thead');$divFoot.empty();$divHead.find('table').clone().appendTo($divFoot);break;case $tfoot.length&&settings.cloneHeadToFoot==false&&settings.footer==true:$divFoot.find('table').append($tfoot).css({'margin-top':-tableProps.border});helpers._setupClone($divFoot,tableProps.tfoot);break;}},_getTableProps:function($obj){var tableProp={thead:{},tbody:{},tfoot:{},border:0},borderCollapse=1;if(settings.borderCollapse==true){borderCollapse=2;}tableProp.border=($obj.find('th:first-child').outerWidth()-$obj.find('th:first-child').innerWidth())/borderCollapse;$obj.find('thead tr:first-child th').each(function(index){tableProp.thead[index]=$(this).width()+tableProp.border;});$obj.find('tfoot tr:first-child td').each(function(index){tableProp.tfoot[index]=$(this).width()+tableProp.border;});$obj.find('tbody tr:first-child td').each(function(index){tableProp.tbody[index]=$(this).width()+tableProp.border;});return tableProp;},_setupClone:function($obj,cellArray){var $self=$obj,selector=($self.find('thead').length)?'thead th':($self.find('tfoot').length)?'tfoot td':'tbody td',$cell;$self.find(selector).each(function(index){$cell=($(this).find('div.fht-cell').length)?$(this).find('div.fht-cell'):$('
').appendTo($(this));$cell.css({'width':parseInt(cellArray[index])});if(!$(this).closest('.fht-tbody').length&&$(this).is(':last-child')&&!$(this).closest('.fht-fixed-column').length){var padding=(($(this).innerWidth()-$(this).width())/2)+settings.scrollbarOffset;$(this).css({'padding-right':padding+'px'});}});},_isPaddingIncludedWithWidth:function(){var $obj=$('
test
'),defaultHeight,newHeight;$obj.appendTo('body');defaultHeight=$obj.find('td').height();$obj.find('td').css('height',$obj.find('tr').height());newHeight=$obj.find('td').height();$obj.remove();if(defaultHeight!=newHeight){return true;}else{return false;}},_getScrollbarWidth:function(){var scrollbarWidth=0;if(!scrollbarWidth){if($.browser.msie){var $textarea1=$('').css({position:'absolute',top:-1000,left:-1000}).appendTo('body'),$textarea2=$('').css({position:'absolute',top:-1000,left:-1000}).appendTo('body');scrollbarWidth=$textarea1.width()-$textarea2.width()+2;$textarea1.add($textarea2).remove();}else{var $div=$('
').css({width:100,height:100,overflow:'auto',position:'absolute',top:-1000,left:-1000}).prependTo('body').append('
').find('div').css({width:'100%',height:200});scrollbarWidth=100-$div.width();$div.parent().remove();}}return scrollbarWidth;}}if(methods[method]){return methods[method].apply(this,Array.prototype.slice.call(arguments,1));}else if(typeof method==='object'||!method){return methods.init.apply(this,arguments);}else{$.error('Method "'+method+'" does not exist in fixedHeaderTable plugin!');}};})(jQuery); \ No newline at end of file From 571fe4c707128d0f2ccb25852507ffef265b6842 Mon Sep 17 00:00:00 2001 From: Tad Fisher Date: Mon, 1 Aug 2011 10:25:01 -1000 Subject: [PATCH 17/18] Added mousewheel include note to readme --- README.md | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index db8921f..02ebe50 100644 --- a/README.md +++ b/README.md @@ -16,4 +16,10 @@ * cloneHeadToFoot - Boolean - Default: false * autoShow - Boolean - Default: true * altClass - String - Default: none -* themeClass - String - Default: none \ No newline at end of file +* themeClass - String - Default: none + +### Notes: + +If you aren't using the minified version, be sure to include +`lib/jquery.mousewheel.min.js` in your page if you require mousewheel +scrolling via fixed columns. \ No newline at end of file From 00b1badbcdc47d6452395e2afb2e706c46587217 Mon Sep 17 00:00:00 2001 From: Tad Fisher Date: Mon, 1 Aug 2011 10:49:59 -1000 Subject: [PATCH 18/18] Fixed mousewheel scroll distance, some JSLint complaints, corrected minification --- README.md | 2 +- jquery.fixedheadertable.js | 148 ++++++++++++++++----------------- jquery.fixedheadertable.min.js | 80 +++++++++++++----- lib/jquery.mousewheel.js | 90 ++++++++++++++++++++ lib/jquery.mousewheel.min.js | 12 --- 5 files changed, 226 insertions(+), 106 deletions(-) create mode 100644 lib/jquery.mousewheel.js delete mode 100644 lib/jquery.mousewheel.min.js diff --git a/README.md b/README.md index 02ebe50..d5e1239 100644 --- a/README.md +++ b/README.md @@ -21,5 +21,5 @@ ### Notes: If you aren't using the minified version, be sure to include -`lib/jquery.mousewheel.min.js` in your page if you require mousewheel +`lib/jquery.mousewheel.js` in your page if you require mousewheel scrolling via fixed columns. \ No newline at end of file diff --git a/jquery.fixedheadertable.js b/jquery.fixedheadertable.js index 82453b9..4640508 100644 --- a/jquery.fixedheadertable.js +++ b/jquery.fixedheadertable.js @@ -50,7 +50,7 @@ var $self = $(this), // reference the jQuery version of the current DOM element self = this; // reference to the actual DOM element - if ( helpers._isTable($self) ) { + if (helpers._isTable($self)) { methods.setup.apply(this, Array.prototype.slice.call(arguments, 1)); $.isFunction(settings.create) && settings.create.call(this); } else { @@ -62,7 +62,7 @@ /* * Setup table structure for fixed headers and optional footer */ - setup: function( options ) { + setup: function (options) { var $self = $(this), self = this, $thead = $self.find('thead'), @@ -80,7 +80,7 @@ settings.scrollbarOffset = helpers._getScrollbarWidth(); settings.themeClassName = settings.themeClass; - if ( settings.width.search('%') > -1 ) { + if (settings.width.search('%') > -1) { var widthMinusScrollbar = $self.parent().width() - settings.scrollbarOffset; } else { var widthMinusScrollbar = settings.width - settings.scrollbarOffset; @@ -91,14 +91,14 @@ }); - if ( !$self.closest('.fht-table-wrapper').length ) { + if (!$self.closest('.fht-table-wrapper').length) { $self.addClass('fht-table'); $self.wrap('
'); } $wrapper = $self.closest('.fht-table-wrapper'); - if ( settings.fixedColumns > 0 && $wrapper.find('.fht-fixed-column').length == 0 ) { + if (settings.fixedColumns > 0 && $wrapper.find('.fht-fixed-column').length == 0) { $self.wrap('
'); var $fixedColumns = $('
').prependTo($wrapper), @@ -111,7 +111,7 @@ }) .addClass(settings.themeClassName); - if ( !$self.hasClass('fht-table-init') ) { + if (!$self.hasClass('fht-table-init')) { $self.wrap('
'); @@ -120,10 +120,10 @@ var tableProps = helpers._getTableProps($self); - helpers._setupClone( $divBody, tableProps.tbody ); + helpers._setupClone($divBody, tableProps.tbody); - if ( !$self.hasClass('fht-table-init') ) { - if ( settings.fixedColumns > 0 ) { + if (!$self.hasClass('fht-table-init')) { + if (settings.fixedColumns > 0) { $divHead = $('
').prependTo($fixedBody); } else { $divHead = $('
').prependTo($wrapper); @@ -134,7 +134,7 @@ $divHead = $wrapper.find('div.fht-thead'); } - helpers._setupClone( $divHead, tableProps.thead ); + helpers._setupClone($divHead, tableProps.thead); $self.css({ 'margin-top': -$divHead.outerHeight(true) @@ -144,11 +144,11 @@ * Check for footer * Setup footer if present */ - if ( settings.footer == true ) { + if (settings.footer == true) { - helpers._setupTableFooter( $self, self, tableProps ); + helpers._setupTableFooter($self, self, tableProps); - if ( !$tfoot.length ) { + if (!$tfoot.length) { $tfoot = $wrapper.find('div.fht-tfoot table'); } @@ -163,19 +163,19 @@ $self.addClass('fht-table-init'); - if ( typeof(settings.altClass) !== 'undefined' ) { - methods.altRows.apply( self ); + if (typeof(settings.altClass) !== 'undefined') { + methods.altRows.apply(self); } - if ( settings.fixedColumns > 0 ) { - helpers._setupFixedColumn( $self, self, tableProps ); + if (settings.fixedColumns > 0) { + helpers._setupFixedColumn($self, self, tableProps); } - if ( !settings.autoShow ) { + if (!settings.autoShow) { $wrapper.hide(); } - helpers._bindScroll( $divBody, tableProps ); + helpers._bindScroll($divBody, tableProps); return self; }, @@ -184,20 +184,19 @@ * Resize the table * Incomplete - not implemented yet */ - resize: function( options ) { + resize: function(options) { var $self = $(this), self = this; - return self; }, /* * Add CSS class to alternating rows */ - altRows: function( arg1 ) { - var $self = $(this), - self = this, - altClass = ( typeof(arg1) !== 'undefined' ) ? arg1 : settings.altClass; + altRows: function(arg1) { + var $self = $(this), + self = this, + altClass = (typeof(arg1) !== 'undefined') ? arg1 : settings.altClass; $self.closest('.fht-table-wrapper') .find('tbody tr:odd:not(:hidden)') @@ -207,13 +206,13 @@ /* * Show a hidden fixedHeaderTable table */ - show: function( arg1, arg2, arg3 ) { + show: function(arg1, arg2, arg3) { var $self = $(this), self = this, $wrapper = $self.closest('.fht-table-wrapper'); // User provided show duration without a specific effect - if ( typeof(arg1) !== 'undefined' && typeof(arg1) === 'number' ) { + if (typeof(arg1) !== 'undefined' && typeof(arg1) === 'number') { $wrapper.show(arg1, function() { $.isFunction(arg2) && arg2.call(this); @@ -221,8 +220,8 @@ return self; - } else if ( typeof(arg1) !== 'undefined' && typeof(arg1) === 'string' - && typeof(arg2) !== 'undefined' && typeof(arg2) === 'number' ) { + } else if (typeof(arg1) !== 'undefined' && typeof(arg1) === 'string' + && typeof(arg2) !== 'undefined' && typeof(arg2) === 'number') { // User provided show duration with an effect $wrapper.show(arg1, arg2, function() { @@ -243,20 +242,20 @@ /* * Hide a fixedHeaderTable table */ - hide: function( arg1, arg2, arg3 ) { + hide: function(arg1, arg2, arg3) { var $self = $(this), self = this, $wrapper = $self.closest('.fht-table-wrapper'); // User provided show duration without a specific effect - if ( typeof(arg1) !== 'undefined' && typeof(arg1) === 'number' ) { + if (typeof(arg1) !== 'undefined' && typeof(arg1) === 'number') { $wrapper.hide(arg1, function() { $.isFunction(arg3) && arg3.call(this); }); return self; - } else if ( typeof(arg1) !== 'undefined' && typeof(arg1) === 'string' - && typeof(arg2) !== 'undefined' && typeof(arg2) === 'number' ) { + } else if (typeof(arg1) !== 'undefined' && typeof(arg1) === 'string' + && typeof(arg2) !== 'undefined' && typeof(arg2) === 'number') { $wrapper.hide(arg1, arg2, function() { $.isFunction(arg3) && arg3.call(this); @@ -304,13 +303,13 @@ * return boolean * True if a thead and tbody exist. */ - _isTable: function( $obj ) { + _isTable: function($obj) { var $self = $obj, hasTable = $self.is('table'), hasThead = $self.find('thead').length > 0, hasTbody = $self.find('tbody').length > 0; - if ( hasTable && hasThead && hasTbody ) { + if (hasTable && hasThead && hasTbody) { return true; } @@ -322,14 +321,14 @@ * return void * bind scroll event */ - _bindScroll: function( $obj, tableProps ) { + _bindScroll: function($obj, tableProps) { var $self = $obj, $wrapper = $self.closest('.fht-table-wrapper'), $thead = $self.siblings('.fht-thead'), $tfoot = $self.siblings('.fht-tfoot'); $self.bind('scroll', function() { - if ( settings.fixedColumns > 0 ) { + if (settings.fixedColumns > 0) { var $fixedColumns = $wrapper.find('.fht-fixed-column'); $fixedColumns.find('.fht-tbody table') @@ -343,7 +342,7 @@ 'margin-left': -this.scrollLeft }); - if ( settings.cloneHeadToFoot ) { + if (settings.cloneHeadToFoot) { $tfoot.find('table') .css({ 'margin-left': -this.scrollLeft @@ -355,8 +354,8 @@ /* * return void */ - _fixHeightWithCss: function ( $obj, tableProps ) { - if ( settings.includePadding ) { + _fixHeightWithCss: function ($obj, tableProps) { + if (settings.includePadding) { $obj.css({ 'height': $obj.height() + tableProps.border }); @@ -370,8 +369,8 @@ /* * return void */ - _fixWidthWithCss: function( $obj, tableProps, width ) { - if ( settings.includePadding ) { + _fixWidthWithCss: function($obj, tableProps, width) { + if (settings.includePadding) { $obj.each(function(index) { $(this).css({ 'width': width == undefined ? $(this).width() + tableProps.border : width + tableProps.border @@ -390,7 +389,7 @@ /* * return void */ - _setupFixedColumn: function ( $obj, obj, tableProps ) { + _setupFixedColumn: function ($obj, obj, tableProps) { var $self = $obj, self = obj, $wrapper = $self.closest('.fht-table-wrapper'), @@ -413,8 +412,8 @@ }); // Fix cell heights - helpers._fixHeightWithCss( $firstThChildren, tableProps ); - helpers._fixWidthWithCss( $firstThChildren, tableProps ); + helpers._fixHeightWithCss($firstThChildren, tableProps); + helpers._fixWidthWithCss($firstThChildren, tableProps); var tdWidths = []; $firstThChildren.each(function(index) { @@ -423,9 +422,9 @@ firstTdChildrenSelector = 'tbody tr td:not(:nth-child(n+' + (settings.fixedColumns + 1) + '))'; $firstTdChildren = $fixedBody.find(firstTdChildrenSelector) - .each( function(index) { - helpers._fixHeightWithCss( $(this), tableProps); - helpers._fixWidthWithCss( $(this), tableProps, tdWidths[index % settings.fixedColumns] ); + .each(function(index) { + helpers._fixHeightWithCss($(this), tableProps); + helpers._fixWidthWithCss($(this), tableProps, tdWidths[index % settings.fixedColumns] ); }); // clone header @@ -444,7 +443,7 @@ if (index % settings.fixedColumns == 0) { $newRow = $('').appendTo($tbody.find('tbody')); - if ( settings.altClass && $(this).parent().hasClass(settings.altClass) ) { + if (settings.altClass && $(this).parent().hasClass(settings.altClass)) { $newRow.addClass(settings.altClass); } } @@ -462,13 +461,14 @@ // bind mousewheel events var maxTop = $fixedColumn.find('.fht-tbody .fht-table').height() - $fixedColumn.find('.fht-tbody').height(); - console.log(maxTop); - $fixedColumn.find('.fht-table').bind('mousewheel', function(event, delta) { - var top = parseInt($(this).css('marginTop'), 10) + (delta > 0 ? 40 : -40); + $fixedColumn.find('.fht-table').bind('mousewheel', function(event, delta, deltaX, deltaY) { + if (deltaY == 0) return; + var top = parseInt($(this).css('marginTop'), 10) + (deltaY > 0 ? 120 : -120); if (top > 0) top = 0; if (top < -maxTop) top = -maxTop; $(this).css('marginTop', top); - $fixedBody.find('.fht-tbody').scrollTop(-top); + $fixedBody.find('.fht-tbody').scrollTop(-top).scroll(); + return false; }); @@ -478,10 +478,10 @@ }); // setup clone footer with fixed column - if ( settings.footer == true || settings.cloneHeadToFoot == true ) { + if (settings.footer == true || settings.cloneHeadToFoot == true) { var $firstTdFootChild = $fixedBody.find('.fht-tfoot thead tr th:lt(' + settings.fixedColumns + ')'); - helpers._fixHeightWithCss( $firstTdFootChild, tableProps ); + helpers._fixHeightWithCss($firstTdFootChild, tableProps); $tfoot.appendTo($fixedColumn) .find('tr') .append($firstTdFootChild.clone()); @@ -494,7 +494,7 @@ /* * return void */ - _setupTableFooter: function ( $obj, obj, tableProps ) { + _setupTableFooter: function ($obj, obj, tableProps) { var $self = $obj, self = obj, @@ -502,8 +502,8 @@ $tfoot = $self.find('tfoot'), $divFoot = $wrapper.find('div.fht-tfoot'); - if ( !$divFoot.length ) { - if ( settings.fixedColumns > 0 ) { + if (!$divFoot.length) { + if (settings.fixedColumns > 0) { $divFoot = $('
').appendTo($wrapper.find('.fht-fixed-body')); } else { $divFoot = $('
').appendTo($wrapper); @@ -529,7 +529,7 @@ 'margin-top': -tableProps.border }); - helpers._setupClone( $divFoot, tableProps.tfoot ); + helpers._setupClone($divFoot, tableProps.tfoot); break; } @@ -541,7 +541,7 @@ * Widths of each thead cell and tbody cell for the first rows. * Used in fixing widths for the fixed header and optional footer. */ - _getTableProps: function( $obj ) { + _getTableProps: function($obj) { var tableProp = { thead: {}, tbody: {}, @@ -550,11 +550,11 @@ }, borderCollapse = 1; - if ( settings.borderCollapse == true ) { + if (settings.borderCollapse == true) { borderCollapse = 2; } - tableProp.border = ( $obj.find('th:first-child').outerWidth() - $obj.find('th:first-child').innerWidth() ) / borderCollapse; + tableProp.border = ($obj.find('th:first-child').outerWidth() - $obj.find('th:first-child').innerWidth()) / borderCollapse; $obj.find('thead tr:first-child th').each(function(index) { tableProp.thead[index] = $(this).width() + tableProp.border; @@ -575,17 +575,17 @@ * return void * Fix widths of each cell in the first row of obj. */ - _setupClone: function( $obj, cellArray ) { + _setupClone: function($obj, cellArray) { var $self = $obj, - selector = ( $self.find('thead').length ) ? + selector = ($self.find('thead').length) ? 'thead th' : - ( $self.find('tfoot').length ) ? + ($self.find('tfoot').length) ? 'tfoot td' : 'tbody td', $cell; $self.find(selector).each(function(index) { - $cell = ( $(this).find('div.fht-cell').length ) ? $(this).find('div.fht-cell') : $('
').appendTo($(this)); + $cell = ($(this).find('div.fht-cell').length) ? $(this).find('div.fht-cell') : $('
').appendTo($(this)); $cell.css({ 'width': parseInt(cellArray[index]) @@ -595,8 +595,8 @@ * Fixed Header and Footer should extend the full width * to align with the scrollbar of the body */ - if ( !$(this).closest('.fht-tbody').length && $(this).is(':last-child') && !$(this).closest('.fht-fixed-column').length ) { - var padding = ( ( $(this).innerWidth() - $(this).width() ) / 2 ) + settings.scrollbarOffset; + if (!$(this).closest('.fht-tbody').length && $(this).is(':last-child') && !$(this).closest('.fht-fixed-column').length) { + var padding = (($(this).innerWidth() - $(this).width()) / 2) + settings.scrollbarOffset; $(this).css({ 'padding-right': padding + 'px' }); @@ -625,7 +625,7 @@ newHeight = $obj.find('td').height(); $obj.remove(); - if ( defaultHeight != newHeight ) { + if (defaultHeight != newHeight) { return true; } else { return false; @@ -640,8 +640,8 @@ _getScrollbarWidth: function() { var scrollbarWidth = 0; - if ( !scrollbarWidth ) { - if ( $.browser.msie ) { + if (!scrollbarWidth) { + if ($.browser.msie) { var $textarea1 = $('') .css({ position: 'absolute', top: -1000, left: -1000 }).appendTo('body'), $textarea2 = $('') @@ -665,13 +665,13 @@ // if a method as the given argument exists - if ( methods[method] ) { + if (methods[method]) { // call the respective method return methods[method].apply(this, Array.prototype.slice.call(arguments, 1)); // if an object is given as method OR nothing is given as argument - } else if ( typeof method === 'object' || !method ) { + } else if (typeof method === 'object' || !method) { // call the initialization method return methods.init.apply(this, arguments); @@ -680,7 +680,7 @@ } else { // trigger an error - $.error( 'Method "' + method + '" does not exist in fixedHeaderTable plugin!'); + $.error('Method "' + method + '" does not exist in fixedHeaderTable plugin!'); } diff --git a/jquery.fixedheadertable.min.js b/jquery.fixedheadertable.min.js index 1784b40..473f5c2 100644 --- a/jquery.fixedheadertable.min.js +++ b/jquery.fixedheadertable.min.js @@ -1,20 +1,62 @@ +/*! Copyright (c) 2010 Brandon Aaron (http://brandonaaron.net) + * Licensed under the MIT License (LICENSE.txt). + * + * Thanks to: http://adomas.org/javascript-mouse-wheel/ for some pointers. + * Thanks to: Mathias Bank(http://www.mathias-bank.de) for a scope bug fix. + * Thanks to: Seamus Leahy for adding deltaX and deltaY + * + * Version: 3.0.4 + * + * Requires: 1.2.2+ + */ -(function(c){var a=["DOMMouseScroll","mousewheel"];c.event.special.mousewheel={setup:function(){if(this.addEventListener){for(var d=a.length;d;){this.addEventListener(a[--d],b,false)}}else{this.onmousewheel=b}},teardown:function(){if(this.removeEventListener){for(var d=a.length;d;){this.removeEventListener(a[--d],b,false)}}else{this.onmousewheel=null}}};c.fn.extend({mousewheel:function(d){return d?this.bind("mousewheel",d):this.trigger("mousewheel")},unmousewheel:function(d){return this.unbind("mousewheel",d)}});function b(i){var g=i||window.event,f=[].slice.call(arguments,1),j=0,h=true,e=0,d=0;i=c.event.fix(g);i.type="mousewheel";if(i.wheelDelta){j=i.wheelDelta/120}if(i.detail){j=-i.detail/3}d=j;if(g.axis!==undefined&&g.axis===g.HORIZONTAL_AXIS){d=0;e=-1*j}if(g.wheelDeltaY!==undefined){d=g.wheelDeltaY/120}if(g.wheelDeltaX!==undefined){e=-1*g.wheelDeltaX/120}f.unshift(i,j,e,d);return c.event.handle.apply(this,f)}})(jQuery);/*! - jquery.fixedHeaderTable. The jQuery fixedHeaderTable plugin - - Copyright (c) 2011 Mark Malek - http://fixedheadertable.com - - Licensed under MIT - http://www.opensource.org/licenses/mit-license.php - - http://docs.jquery.com/Plugins/Authoring - jQuery authoring guidelines - - Launch : October 2009 - Version : 1.3 - Released: May 9th, 2011 - - - all CSS sizing (width,height) is done in pixels (px) - */(function($){$.fn.fixedHeaderTable=function(method){var defaults={width:'100%',height:'100%',themeClass:'fht-default',borderCollapse:true,fixedColumns:0,sortable:false,autoShow:true,footer:false,cloneHeadToFoot:false,autoResize:false,create:null};var settings={};var methods={init:function(options){settings=$.extend({},defaults,options);return this.each(function(){var $self=$(this),self=this;if(helpers._isTable($self)){methods.setup.apply(this,Array.prototype.slice.call(arguments,1));$.isFunction(settings.create)&&settings.create.call(this);}else{$.error('Invalid table mark-up');}});},setup:function(options){var $self=$(this),self=this,$thead=$self.find('thead'),$tfoot=$self.find('tfoot'),$tbody=$self.find('tbody'),$wrapper,$divHead,$divFoot,$divBody,$fixedHeadRow,$temp,tfootHeight=0;settings.includePadding=helpers._isPaddingIncludedWithWidth();settings.scrollbarOffset=helpers._getScrollbarWidth();settings.themeClassName=settings.themeClass;if(settings.width.search('%')>-1){var widthMinusScrollbar=$self.parent().width()-settings.scrollbarOffset;}else{var widthMinusScrollbar=settings.width-settings.scrollbarOffset;}$self.css({width:widthMinusScrollbar});if(!$self.closest('.fht-table-wrapper').length){$self.addClass('fht-table');$self.wrap('
');}$wrapper=$self.closest('.fht-table-wrapper');if(settings.fixedColumns>0&&$wrapper.find('.fht-fixed-column').length==0){$self.wrap('
');var $fixedColumns=$('
').prependTo($wrapper),$fixedBody=$wrapper.find('.fht-fixed-body');}$wrapper.css({width:settings.width,height:settings.height}).addClass(settings.themeClassName);if(!$self.hasClass('fht-table-init')){$self.wrap('
');}$divBody=$self.closest('.fht-tbody');var tableProps=helpers._getTableProps($self);helpers._setupClone($divBody,tableProps.tbody);if(!$self.hasClass('fht-table-init')){if(settings.fixedColumns>0){$divHead=$('
').prependTo($fixedBody);}else{$divHead=$('
').prependTo($wrapper);}$thead.clone().appendTo($divHead.find('table'));}else{$divHead=$wrapper.find('div.fht-thead');}helpers._setupClone($divHead,tableProps.thead);$self.css({'margin-top':-$divHead.outerHeight(true)});if(settings.footer==true){helpers._setupTableFooter($self,self,tableProps);if(!$tfoot.length){$tfoot=$wrapper.find('div.fht-tfoot table');}tfootHeight=$tfoot.outerHeight(true);}var tbodyHeight=$wrapper.height()-$thead.outerHeight(true)-tfootHeight-tableProps.border;$divBody.css({'height':tbodyHeight});$self.addClass('fht-table-init');if(typeof(settings.altClass)!=='undefined'){methods.altRows.apply(self);}if(settings.fixedColumns>0){helpers._setupFixedColumn($self,self,tableProps);}if(!settings.autoShow){$wrapper.hide();}helpers._bindScroll($divBody,tableProps);return self;},resize:function(options){var $self=$(this),self=this;return self;},altRows:function(arg1){var $self=$(this),self=this,altClass=(typeof(arg1)!=='undefined')?arg1:settings.altClass;$self.closest('.fht-table-wrapper').find('tbody tr:odd:not(:hidden)').addClass(altClass);},show:function(arg1,arg2,arg3){var $self=$(this),self=this,$wrapper=$self.closest('.fht-table-wrapper');if(typeof(arg1)!=='undefined'&&typeof(arg1)==='number'){$wrapper.show(arg1,function(){$.isFunction(arg2)&&arg2.call(this);});return self;}else if(typeof(arg1)!=='undefined'&&typeof(arg1)==='string'&&typeof(arg2)!=='undefined'&&typeof(arg2)==='number'){$wrapper.show(arg1,arg2,function(){$.isFunction(arg3)&&arg3.call(this);});return self;}$self.closest('.fht-table-wrapper').show();$.isFunction(arg1)&&arg1.call(this);return self;},hide:function(arg1,arg2,arg3){var $self=$(this),self=this,$wrapper=$self.closest('.fht-table-wrapper');if(typeof(arg1)!=='undefined'&&typeof(arg1)==='number'){$wrapper.hide(arg1,function(){$.isFunction(arg3)&&arg3.call(this);});return self;}else if(typeof(arg1)!=='undefined'&&typeof(arg1)==='string'&&typeof(arg2)!=='undefined'&&typeof(arg2)==='number'){$wrapper.hide(arg1,arg2,function(){$.isFunction(arg3)&&arg3.call(this);});return self;}$self.closest('.fht-table-wrapper').hide();$.isFunction(arg3)&&arg3.call(this);return self;},destroy:function(){var $self=$(this),self=this,$wrapper=$self.closest('.fht-table-wrapper');$self.insertBefore($wrapper).removeAttr('style').append($wrapper.find('tfoot')).removeClass('fht-table fht-table-init').find('.fht-cell').remove();$wrapper.remove();return self;}}var helpers={_isTable:function($obj){var $self=$obj,hasTable=$self.is('table'),hasThead=$self.find('thead').length>0,hasTbody=$self.find('tbody').length>0;if(hasTable&&hasThead&&hasTbody){return true;}return false;},_bindScroll:function($obj,tableProps){var $self=$obj,$wrapper=$self.closest('.fht-table-wrapper'),$thead=$self.siblings('.fht-thead'),$tfoot=$self.siblings('.fht-tfoot');$self.bind('scroll',function(){if(settings.fixedColumns>0){var $fixedColumns=$wrapper.find('.fht-fixed-column');$fixedColumns.find('.fht-tbody table').css({'margin-top':-$self.scrollTop()});}$thead.find('table').css({'margin-left':-this.scrollLeft});if(settings.cloneHeadToFoot){$tfoot.find('table').css({'margin-left':-this.scrollLeft});}});},_fixHeightWithCss:function($obj,tableProps){if(settings.includePadding){$obj.css({'height':$obj.height()+tableProps.border});}else{$obj.css({'height':$obj.parent().height()+tableProps.border});}},_fixWidthWithCss:function($obj,tableProps,width){if(settings.includePadding){$obj.each(function(index){$(this).css({'width':width==undefined?$(this).width()+tableProps.border:width+tableProps.border});});}else{$obj.each(function(index){$(this).css({'width':width==undefined?$(this).parent().width()+tableProps.border:width+tableProps.border});});}},_setupFixedColumn:function($obj,obj,tableProps){var $self=$obj,self=obj,$wrapper=$self.closest('.fht-table-wrapper'),$fixedBody=$wrapper.find('.fht-fixed-body'),$fixedColumn=$wrapper.find('.fht-fixed-column'),$thead=$('
'),$tbody=$('
'),$tfoot=$('
'),$firstThChildren,$firstTdChildren,fixedColumnWidth,fixedBodyWidth=$wrapper.width(),fixedBodyHeight=$fixedBody.find('.fht-tbody').height()-settings.scrollbarOffset,$newRow;$firstThChildren=$fixedBody.find('.fht-thead thead tr th:lt('+settings.fixedColumns+')');fixedColumnWidth=settings.fixedColumns*tableProps.border;$firstThChildren.each(function(index){fixedColumnWidth+=$(this).outerWidth(true);});helpers._fixHeightWithCss($firstThChildren,tableProps);helpers._fixWidthWithCss($firstThChildren,tableProps);var tdWidths=[];$firstThChildren.each(function(index){tdWidths.push($(this).width());});firstTdChildrenSelector='tbody tr td:not(:nth-child(n+'+(settings.fixedColumns+1)+'))';$firstTdChildren=$fixedBody.find(firstTdChildrenSelector).each(function(index){helpers._fixHeightWithCss($(this),tableProps);helpers._fixWidthWithCss($(this),tableProps,tdWidths[index%settings.fixedColumns]);});$thead.appendTo($fixedColumn).find('tr').append($firstThChildren.clone());$tbody.appendTo($fixedColumn).css({'margin-top':-1,'height':fixedBodyHeight+tableProps.border});var $newRow;$firstTdChildren.each(function(index){if(index%settings.fixedColumns==0){$newRow=$('').appendTo($tbody.find('tbody'));if(settings.altClass&&$(this).parent().hasClass(settings.altClass)){$newRow.addClass(settings.altClass);}}$(this).clone().appendTo($newRow);});$fixedColumn.css({'height':0,'width':fixedColumnWidth})var maxTop=$fixedColumn.find('.fht-tbody .fht-table').height()-$fixedColumn.find('.fht-tbody').height();console.log(maxTop);$fixedColumn.find('.fht-table').bind('mousewheel',function(event,delta){var top=parseInt($(this).css('marginTop'),10)+(delta>0?40:-40);if(top>0)top=0;if(top<-maxTop)top=-maxTop;$(this).css('marginTop',top);$fixedBody.find('.fht-tbody').scrollTop(-top);});$fixedBody.css({'width':fixedBodyWidth});if(settings.footer==true||settings.cloneHeadToFoot==true){var $firstTdFootChild=$fixedBody.find('.fht-tfoot thead tr th:lt('+settings.fixedColumns+')');helpers._fixHeightWithCss($firstTdFootChild,tableProps);$tfoot.appendTo($fixedColumn).find('tr').append($firstTdFootChild.clone());$tfoot.css({'top':settings.scrollbarOffset});}},_setupTableFooter:function($obj,obj,tableProps){var $self=$obj,self=obj,$wrapper=$self.closest('.fht-table-wrapper'),$tfoot=$self.find('tfoot'),$divFoot=$wrapper.find('div.fht-tfoot');if(!$divFoot.length){if(settings.fixedColumns>0){$divFoot=$('
').appendTo($wrapper.find('.fht-fixed-body'));}else{$divFoot=$('
').appendTo($wrapper);}}switch(true){case!$tfoot.length&&settings.cloneHeadToFoot==true&&settings.footer==true:var $divHead=$wrapper.find('div.fht-thead');$divFoot.empty();$divHead.find('table').clone().appendTo($divFoot);break;case $tfoot.length&&settings.cloneHeadToFoot==false&&settings.footer==true:$divFoot.find('table').append($tfoot).css({'margin-top':-tableProps.border});helpers._setupClone($divFoot,tableProps.tfoot);break;}},_getTableProps:function($obj){var tableProp={thead:{},tbody:{},tfoot:{},border:0},borderCollapse=1;if(settings.borderCollapse==true){borderCollapse=2;}tableProp.border=($obj.find('th:first-child').outerWidth()-$obj.find('th:first-child').innerWidth())/borderCollapse;$obj.find('thead tr:first-child th').each(function(index){tableProp.thead[index]=$(this).width()+tableProp.border;});$obj.find('tfoot tr:first-child td').each(function(index){tableProp.tfoot[index]=$(this).width()+tableProp.border;});$obj.find('tbody tr:first-child td').each(function(index){tableProp.tbody[index]=$(this).width()+tableProp.border;});return tableProp;},_setupClone:function($obj,cellArray){var $self=$obj,selector=($self.find('thead').length)?'thead th':($self.find('tfoot').length)?'tfoot td':'tbody td',$cell;$self.find(selector).each(function(index){$cell=($(this).find('div.fht-cell').length)?$(this).find('div.fht-cell'):$('
').appendTo($(this));$cell.css({'width':parseInt(cellArray[index])});if(!$(this).closest('.fht-tbody').length&&$(this).is(':last-child')&&!$(this).closest('.fht-fixed-column').length){var padding=(($(this).innerWidth()-$(this).width())/2)+settings.scrollbarOffset;$(this).css({'padding-right':padding+'px'});}});},_isPaddingIncludedWithWidth:function(){var $obj=$('
test
'),defaultHeight,newHeight;$obj.appendTo('body');defaultHeight=$obj.find('td').height();$obj.find('td').css('height',$obj.find('tr').height());newHeight=$obj.find('td').height();$obj.remove();if(defaultHeight!=newHeight){return true;}else{return false;}},_getScrollbarWidth:function(){var scrollbarWidth=0;if(!scrollbarWidth){if($.browser.msie){var $textarea1=$('').css({position:'absolute',top:-1000,left:-1000}).appendTo('body'),$textarea2=$('').css({position:'absolute',top:-1000,left:-1000}).appendTo('body');scrollbarWidth=$textarea1.width()-$textarea2.width()+2;$textarea1.add($textarea2).remove();}else{var $div=$('
').css({width:100,height:100,overflow:'auto',position:'absolute',top:-1000,left:-1000}).prependTo('body').append('
').find('div').css({width:'100%',height:200});scrollbarWidth=100-$div.width();$div.parent().remove();}}return scrollbarWidth;}}if(methods[method]){return methods[method].apply(this,Array.prototype.slice.call(arguments,1));}else if(typeof method==='object'||!method){return methods.init.apply(this,arguments);}else{$.error('Method "'+method+'" does not exist in fixedHeaderTable plugin!');}};})(jQuery); \ No newline at end of file +/*! + * jquery.fixedHeaderTable. The jQuery fixedHeaderTable plugin + * + * Copyright (c) 2011 Mark Malek + * http://fixedheadertable.com + * + * Licensed under MIT + * http://www.opensource.org/licenses/mit-license.php + * + * http://docs.jquery.com/Plugins/Authoring + * jQuery authoring guidelines + * + * Launch : October 2009 + * Version : 1.3 + * Released: May 9th, 2011 + * + * + * all CSS sizing (width,height) is done in pixels (px) + */ + + +(function($){var types=['DOMMouseScroll','mousewheel'];$.event.special.mousewheel={setup:function(){if(this.addEventListener){for(var i=types.length;i;){this.addEventListener(types[--i],handler,false);}}else{this.onmousewheel=handler;}},teardown:function(){if(this.removeEventListener){for(var i=types.length;i;){this.removeEventListener(types[--i],handler,false);}}else{this.onmousewheel=null;}}};$.fn.extend({mousewheel:function(fn){return fn?this.bind("mousewheel",fn):this.trigger("mousewheel");},unmousewheel:function(fn){return this.unbind("mousewheel",fn);}});function handler(event){var orgEvent=event||window.event,args=[].slice.call(arguments,1),delta=0,returnValue=true,deltaX=0,deltaY=0;event=$.event.fix(orgEvent);event.type="mousewheel";if(event.wheelDelta){delta=event.wheelDelta/120;} +if(event.detail){delta=-event.detail/3;} +deltaY=delta;if(orgEvent.axis!==undefined&&orgEvent.axis===orgEvent.HORIZONTAL_AXIS){deltaY=0;deltaX=-1*delta;} +var userAgent=navigator.userAgent.toLowerCase();var wheelDeltaScaleFactor=1;if(jQuery.browser.msie||(jQuery.browser.webkit&&!(/chrome/.test(userAgent)))){wheelDeltaScaleFactor=40;} +if(orgEvent.wheelDeltaY!==undefined){deltaY=orgEvent.wheelDeltaY/120/wheelDeltaScaleFactor;} +if(orgEvent.wheelDeltaX!==undefined){deltaX=-1*orgEvent.wheelDeltaX/120/wheelDeltaScaleFactor;} +args.unshift(event,delta,deltaX,deltaY);return $.event.handle.apply(this,args);}})(jQuery);(function($){$.fn.fixedHeaderTable=function(method){var defaults={width:'100%',height:'100%',themeClass:'fht-default',borderCollapse:true,fixedColumns:0,sortable:false,autoShow:true,footer:false,cloneHeadToFoot:false,autoResize:false,create:null};var settings={};var methods={init:function(options){settings=$.extend({},defaults,options);return this.each(function(){var $self=$(this),self=this;if(helpers._isTable($self)){methods.setup.apply(this,Array.prototype.slice.call(arguments,1));$.isFunction(settings.create)&&settings.create.call(this);}else{$.error('Invalid table mark-up');}});},setup:function(options){var $self=$(this),self=this,$thead=$self.find('thead'),$tfoot=$self.find('tfoot'),$tbody=$self.find('tbody'),$wrapper,$divHead,$divFoot,$divBody,$fixedHeadRow,$temp,tfootHeight=0;settings.includePadding=helpers._isPaddingIncludedWithWidth();settings.scrollbarOffset=helpers._getScrollbarWidth();settings.themeClassName=settings.themeClass;if(settings.width.search('%')>-1){var widthMinusScrollbar=$self.parent().width()-settings.scrollbarOffset;}else{var widthMinusScrollbar=settings.width-settings.scrollbarOffset;} +$self.css({width:widthMinusScrollbar});if(!$self.closest('.fht-table-wrapper').length){$self.addClass('fht-table');$self.wrap('
');} +$wrapper=$self.closest('.fht-table-wrapper');if(settings.fixedColumns>0&&$wrapper.find('.fht-fixed-column').length==0){$self.wrap('
');var $fixedColumns=$('
').prependTo($wrapper),$fixedBody=$wrapper.find('.fht-fixed-body');} +$wrapper.css({width:settings.width,height:settings.height}).addClass(settings.themeClassName);if(!$self.hasClass('fht-table-init')){$self.wrap('
');} +$divBody=$self.closest('.fht-tbody');var tableProps=helpers._getTableProps($self);helpers._setupClone($divBody,tableProps.tbody);if(!$self.hasClass('fht-table-init')){if(settings.fixedColumns>0){$divHead=$('
').prependTo($fixedBody);}else{$divHead=$('
').prependTo($wrapper);} +$thead.clone().appendTo($divHead.find('table'));}else{$divHead=$wrapper.find('div.fht-thead');} +helpers._setupClone($divHead,tableProps.thead);$self.css({'margin-top':-$divHead.outerHeight(true)});if(settings.footer==true){helpers._setupTableFooter($self,self,tableProps);if(!$tfoot.length){$tfoot=$wrapper.find('div.fht-tfoot table');} +tfootHeight=$tfoot.outerHeight(true);} +var tbodyHeight=$wrapper.height()-$thead.outerHeight(true)-tfootHeight-tableProps.border;$divBody.css({'height':tbodyHeight});$self.addClass('fht-table-init');if(typeof(settings.altClass)!=='undefined'){methods.altRows.apply(self);} +if(settings.fixedColumns>0){helpers._setupFixedColumn($self,self,tableProps);} +if(!settings.autoShow){$wrapper.hide();} +helpers._bindScroll($divBody,tableProps);return self;},resize:function(options){var $self=$(this),self=this;return self;},altRows:function(arg1){var $self=$(this),self=this,altClass=(typeof(arg1)!=='undefined')?arg1:settings.altClass;$self.closest('.fht-table-wrapper').find('tbody tr:odd:not(:hidden)').addClass(altClass);},show:function(arg1,arg2,arg3){var $self=$(this),self=this,$wrapper=$self.closest('.fht-table-wrapper');if(typeof(arg1)!=='undefined'&&typeof(arg1)==='number'){$wrapper.show(arg1,function(){$.isFunction(arg2)&&arg2.call(this);});return self;}else if(typeof(arg1)!=='undefined'&&typeof(arg1)==='string'&&typeof(arg2)!=='undefined'&&typeof(arg2)==='number'){$wrapper.show(arg1,arg2,function(){$.isFunction(arg3)&&arg3.call(this);});return self;} +$self.closest('.fht-table-wrapper').show();$.isFunction(arg1)&&arg1.call(this);return self;},hide:function(arg1,arg2,arg3){var $self=$(this),self=this,$wrapper=$self.closest('.fht-table-wrapper');if(typeof(arg1)!=='undefined'&&typeof(arg1)==='number'){$wrapper.hide(arg1,function(){$.isFunction(arg3)&&arg3.call(this);});return self;}else if(typeof(arg1)!=='undefined'&&typeof(arg1)==='string'&&typeof(arg2)!=='undefined'&&typeof(arg2)==='number'){$wrapper.hide(arg1,arg2,function(){$.isFunction(arg3)&&arg3.call(this);});return self;} +$self.closest('.fht-table-wrapper').hide();$.isFunction(arg3)&&arg3.call(this);return self;},destroy:function(){var $self=$(this),self=this,$wrapper=$self.closest('.fht-table-wrapper');$self.insertBefore($wrapper).removeAttr('style').append($wrapper.find('tfoot')).removeClass('fht-table fht-table-init').find('.fht-cell').remove();$wrapper.remove();return self;}} +var helpers={_isTable:function($obj){var $self=$obj,hasTable=$self.is('table'),hasThead=$self.find('thead').length>0,hasTbody=$self.find('tbody').length>0;if(hasTable&&hasThead&&hasTbody){return true;} +return false;},_bindScroll:function($obj,tableProps){var $self=$obj,$wrapper=$self.closest('.fht-table-wrapper'),$thead=$self.siblings('.fht-thead'),$tfoot=$self.siblings('.fht-tfoot');$self.bind('scroll',function(){if(settings.fixedColumns>0){var $fixedColumns=$wrapper.find('.fht-fixed-column');$fixedColumns.find('.fht-tbody table').css({'margin-top':-$self.scrollTop()});} +$thead.find('table').css({'margin-left':-this.scrollLeft});if(settings.cloneHeadToFoot){$tfoot.find('table').css({'margin-left':-this.scrollLeft});}});},_fixHeightWithCss:function($obj,tableProps){if(settings.includePadding){$obj.css({'height':$obj.height()+tableProps.border});}else{$obj.css({'height':$obj.parent().height()+tableProps.border});}},_fixWidthWithCss:function($obj,tableProps,width){if(settings.includePadding){$obj.each(function(index){$(this).css({'width':width==undefined?$(this).width()+tableProps.border:width+tableProps.border});});}else{$obj.each(function(index){$(this).css({'width':width==undefined?$(this).parent().width()+tableProps.border:width+tableProps.border});});}},_setupFixedColumn:function($obj,obj,tableProps){var $self=$obj,self=obj,$wrapper=$self.closest('.fht-table-wrapper'),$fixedBody=$wrapper.find('.fht-fixed-body'),$fixedColumn=$wrapper.find('.fht-fixed-column'),$thead=$('
'),$tbody=$('
'),$tfoot=$('
'),$firstThChildren,$firstTdChildren,fixedColumnWidth,fixedBodyWidth=$wrapper.width(),fixedBodyHeight=$fixedBody.find('.fht-tbody').height()-settings.scrollbarOffset,$newRow;$firstThChildren=$fixedBody.find('.fht-thead thead tr th:lt('+settings.fixedColumns+')');fixedColumnWidth=settings.fixedColumns*tableProps.border;$firstThChildren.each(function(index){fixedColumnWidth+=$(this).outerWidth(true);});helpers._fixHeightWithCss($firstThChildren,tableProps);helpers._fixWidthWithCss($firstThChildren,tableProps);var tdWidths=[];$firstThChildren.each(function(index){tdWidths.push($(this).width());});firstTdChildrenSelector='tbody tr td:not(:nth-child(n+'+(settings.fixedColumns+1)+'))';$firstTdChildren=$fixedBody.find(firstTdChildrenSelector).each(function(index){helpers._fixHeightWithCss($(this),tableProps);helpers._fixWidthWithCss($(this),tableProps,tdWidths[index%settings.fixedColumns]);});$thead.appendTo($fixedColumn).find('tr').append($firstThChildren.clone());$tbody.appendTo($fixedColumn).css({'margin-top':-1,'height':fixedBodyHeight+tableProps.border});var $newRow;$firstTdChildren.each(function(index){if(index%settings.fixedColumns==0){$newRow=$('').appendTo($tbody.find('tbody'));if(settings.altClass&&$(this).parent().hasClass(settings.altClass)){$newRow.addClass(settings.altClass);}} +$(this).clone().appendTo($newRow);});$fixedColumn.css({'height':0,'width':fixedColumnWidth}) +var maxTop=$fixedColumn.find('.fht-tbody .fht-table').height()-$fixedColumn.find('.fht-tbody').height();$fixedColumn.find('.fht-table').bind('mousewheel',function(event,delta,deltaX,deltaY){if(deltaY==0)return;var top=parseInt($(this).css('marginTop'),10)+(deltaY>0?120:-120);if(top>0)top=0;if(top<-maxTop)top=-maxTop;$(this).css('marginTop',top);$fixedBody.find('.fht-tbody').scrollTop(-top).scroll();return false;});$fixedBody.css({'width':fixedBodyWidth});if(settings.footer==true||settings.cloneHeadToFoot==true){var $firstTdFootChild=$fixedBody.find('.fht-tfoot thead tr th:lt('+settings.fixedColumns+')');helpers._fixHeightWithCss($firstTdFootChild,tableProps);$tfoot.appendTo($fixedColumn).find('tr').append($firstTdFootChild.clone());$tfoot.css({'top':settings.scrollbarOffset});}},_setupTableFooter:function($obj,obj,tableProps){var $self=$obj,self=obj,$wrapper=$self.closest('.fht-table-wrapper'),$tfoot=$self.find('tfoot'),$divFoot=$wrapper.find('div.fht-tfoot');if(!$divFoot.length){if(settings.fixedColumns>0){$divFoot=$('
').appendTo($wrapper.find('.fht-fixed-body'));}else{$divFoot=$('
').appendTo($wrapper);}} +switch(true){case!$tfoot.length&&settings.cloneHeadToFoot==true&&settings.footer==true:var $divHead=$wrapper.find('div.fht-thead');$divFoot.empty();$divHead.find('table').clone().appendTo($divFoot);break;case $tfoot.length&&settings.cloneHeadToFoot==false&&settings.footer==true:$divFoot.find('table').append($tfoot).css({'margin-top':-tableProps.border});helpers._setupClone($divFoot,tableProps.tfoot);break;}},_getTableProps:function($obj){var tableProp={thead:{},tbody:{},tfoot:{},border:0},borderCollapse=1;if(settings.borderCollapse==true){borderCollapse=2;} +tableProp.border=($obj.find('th:first-child').outerWidth()-$obj.find('th:first-child').innerWidth())/borderCollapse;$obj.find('thead tr:first-child th').each(function(index){tableProp.thead[index]=$(this).width()+tableProp.border;});$obj.find('tfoot tr:first-child td').each(function(index){tableProp.tfoot[index]=$(this).width()+tableProp.border;});$obj.find('tbody tr:first-child td').each(function(index){tableProp.tbody[index]=$(this).width()+tableProp.border;});return tableProp;},_setupClone:function($obj,cellArray){var $self=$obj,selector=($self.find('thead').length)?'thead th':($self.find('tfoot').length)?'tfoot td':'tbody td',$cell;$self.find(selector).each(function(index){$cell=($(this).find('div.fht-cell').length)?$(this).find('div.fht-cell'):$('
').appendTo($(this));$cell.css({'width':parseInt(cellArray[index])});if(!$(this).closest('.fht-tbody').length&&$(this).is(':last-child')&&!$(this).closest('.fht-fixed-column').length){var padding=(($(this).innerWidth()-$(this).width())/2)+settings.scrollbarOffset;$(this).css({'padding-right':padding+'px'});}});},_isPaddingIncludedWithWidth:function(){var $obj=$('
test
'),defaultHeight,newHeight;$obj.appendTo('body');defaultHeight=$obj.find('td').height();$obj.find('td').css('height',$obj.find('tr').height());newHeight=$obj.find('td').height();$obj.remove();if(defaultHeight!=newHeight){return true;}else{return false;}},_getScrollbarWidth:function(){var scrollbarWidth=0;if(!scrollbarWidth){if($.browser.msie){var $textarea1=$('').css({position:'absolute',top:-1000,left:-1000}).appendTo('body'),$textarea2=$('').css({position:'absolute',top:-1000,left:-1000}).appendTo('body');scrollbarWidth=$textarea1.width()-$textarea2.width()+2;$textarea1.add($textarea2).remove();}else{var $div=$('
').css({width:100,height:100,overflow:'auto',position:'absolute',top:-1000,left:-1000}).prependTo('body').append('
').find('div').css({width:'100%',height:200});scrollbarWidth=100-$div.width();$div.parent().remove();}} +return scrollbarWidth;}} +if(methods[method]){return methods[method].apply(this,Array.prototype.slice.call(arguments,1));}else if(typeof method==='object'||!method){return methods.init.apply(this,arguments);}else{$.error('Method "'+method+'" does not exist in fixedHeaderTable plugin!');}};})(jQuery); \ No newline at end of file diff --git a/lib/jquery.mousewheel.js b/lib/jquery.mousewheel.js new file mode 100644 index 0000000..caaaa01 --- /dev/null +++ b/lib/jquery.mousewheel.js @@ -0,0 +1,90 @@ +/*! Copyright (c) 2010 Brandon Aaron (http://brandonaaron.net) + * Licensed under the MIT License (LICENSE.txt). + * + * Thanks to: http://adomas.org/javascript-mouse-wheel/ for some pointers. + * Thanks to: Mathias Bank(http://www.mathias-bank.de) for a scope bug fix. + * Thanks to: Seamus Leahy for adding deltaX and deltaY + * + * Version: 3.0.4 + * + * Requires: 1.2.2+ + */ + +(function($) { + +var types = ['DOMMouseScroll', 'mousewheel']; + +$.event.special.mousewheel = { + setup: function() { + if ( this.addEventListener ) { + for ( var i=types.length; i; ) { + this.addEventListener( types[--i], handler, false ); + } + } else { + this.onmousewheel = handler; + } + }, + + teardown: function() { + if ( this.removeEventListener ) { + for ( var i=types.length; i; ) { + this.removeEventListener( types[--i], handler, false ); + } + } else { + this.onmousewheel = null; + } + } +}; + +$.fn.extend({ + mousewheel: function(fn) { + return fn ? this.bind("mousewheel", fn) : this.trigger("mousewheel"); + }, + + unmousewheel: function(fn) { + return this.unbind("mousewheel", fn); + } +}); + + +function handler(event) { + var orgEvent = event || window.event, args = [].slice.call( arguments, 1 ), delta = 0, returnValue = true, deltaX = 0, deltaY = 0; + event = $.event.fix(orgEvent); + event.type = "mousewheel"; + + // Old school scrollwheel delta + if ( event.wheelDelta ) { delta = event.wheelDelta/120; } + if ( event.detail ) { delta = -event.detail/3; } + + // New school multidimensional scroll (touchpads) deltas + deltaY = delta; + + // Gecko + if ( orgEvent.axis !== undefined && orgEvent.axis === orgEvent.HORIZONTAL_AXIS ) { + deltaY = 0; + deltaX = -1*delta; + } + + + // Webkit + var userAgent = navigator.userAgent.toLowerCase(); + + var wheelDeltaScaleFactor = 1; + if (jQuery.browser.msie || (jQuery.browser.webkit && !(/chrome/.test(userAgent)))) { + wheelDeltaScaleFactor = 40; + } + + if (orgEvent.wheelDeltaY !== undefined) { + deltaY = orgEvent.wheelDeltaY / 120 / wheelDeltaScaleFactor; + } + if (orgEvent.wheelDeltaX !== undefined) { + deltaX = -1*orgEvent.wheelDeltaX / 120 / wheelDeltaScaleFactor; + } + + // Add event and delta to the front of the arguments + args.unshift(event, delta, deltaX, deltaY); + + return $.event.handle.apply(this, args); +} + +})(jQuery); \ No newline at end of file diff --git a/lib/jquery.mousewheel.min.js b/lib/jquery.mousewheel.min.js deleted file mode 100644 index a17391e..0000000 --- a/lib/jquery.mousewheel.min.js +++ /dev/null @@ -1,12 +0,0 @@ -/* Copyright (c) 2010 Brandon Aaron (http://brandonaaron.net) - * Licensed under the MIT License (LICENSE.txt). - * - * Thanks to: http://adomas.org/javascript-mouse-wheel/ for some pointers. - * Thanks to: Mathias Bank(http://www.mathias-bank.de) for a scope bug fix. - * Thanks to: Seamus Leahy for adding deltaX and deltaY - * - * Version: 3.0.4 - * - * Requires: 1.2.2+ - */ -(function(c){var a=["DOMMouseScroll","mousewheel"];c.event.special.mousewheel={setup:function(){if(this.addEventListener){for(var d=a.length;d;){this.addEventListener(a[--d],b,false)}}else{this.onmousewheel=b}},teardown:function(){if(this.removeEventListener){for(var d=a.length;d;){this.removeEventListener(a[--d],b,false)}}else{this.onmousewheel=null}}};c.fn.extend({mousewheel:function(d){return d?this.bind("mousewheel",d):this.trigger("mousewheel")},unmousewheel:function(d){return this.unbind("mousewheel",d)}});function b(i){var g=i||window.event,f=[].slice.call(arguments,1),j=0,h=true,e=0,d=0;i=c.event.fix(g);i.type="mousewheel";if(i.wheelDelta){j=i.wheelDelta/120}if(i.detail){j=-i.detail/3}d=j;if(g.axis!==undefined&&g.axis===g.HORIZONTAL_AXIS){d=0;e=-1*j}if(g.wheelDeltaY!==undefined){d=g.wheelDeltaY/120}if(g.wheelDeltaX!==undefined){e=-1*g.wheelDeltaX/120}f.unshift(i,j,e,d);return c.event.handle.apply(this,f)}})(jQuery); \ No newline at end of file