diff --git a/stickyheaders.js b/stickyheaders.js
index 3ed9adc..8732512 100644
--- a/stickyheaders.js
+++ b/stickyheaders.js
@@ -1,7 +1,7 @@
// Simple Sticky Header and Column implementation for HTML tables
// (c) Vitaliy Filippov 2016
// License: MPL 2.0+
-// Version: 2016-08-13
+// Version: 2016-08-15
// USAGE:
// makeStickyHeaders(table): add sticky header and footer to table
@@ -27,7 +27,7 @@
// WARNING 5: make sure you have no CSS rules that will differ on the original header row/column and cloned one,
// and that min/max width/height rules apply to the second row/column, not the first header one.
-(function() {
+;(function() {
var _scri = 0;
@@ -127,7 +127,7 @@ window.makeStickyHeaders = function(table)
e.style.height = hs[i]+'px';
e.style.width = w[0]+'px';
}
- var row0top = getOffsetRect(rs[0]).top;
+ var row0top = getOffsetRect(rs[0]).top-getOffsetRect(rs[0].offsetParent).top;
addListener(table.parentNode, 'scroll', function(e)
{
var l = this.scrollLeft, t = this.scrollTop;
diff --git a/treegrid.css b/treegrid.css
index d75d715..d01bd13 100644
--- a/treegrid.css
+++ b/treegrid.css
@@ -9,6 +9,14 @@ body { -moz-text-size-adjust: none; } /* do not scale fonts in mobile firefox */
/* scroll div styles */
.scroller
{
+ position: relative;
+ height: 100%;
+ width: 100%;
+}
+
+.scroller > .inner
+{
+ position: absolute;
height: 100%;
width: 100%;
overflow: auto;
@@ -43,6 +51,10 @@ table.grid
border-collapse: separate;
border-spacing: 0;
border-left: 1px solid #ccc;
+}
+
+table.grid > *:first-child > tr:first-child > *, table.grid > tr:first-child > *
+{
border-top: 1px solid #ccc;
}
diff --git a/treegrid.js b/treegrid.js
index f931e28..29371d4 100644
--- a/treegrid.js
+++ b/treegrid.js
@@ -1,7 +1,7 @@
/**
* Very simple and fast tree grid/table, compatible with dynamic loading and stickyheaders.js
* License: MPL 2.0+, (c) Vitaliy Filippov 2016+
- * Version: 2016-08-12
+ * Version: 2016-08-15
*/
/**
@@ -82,14 +82,27 @@ function TreeGrid(options)
new TreeGridNode({ children: options.items }, this);
}
-TreeGrid.prototype.initStickyHeaders = function()
+TreeGrid.prototype.initStickyHeaders = function(options)
{
this.sticky = true;
- this.stickyInit = this.header && this.header.length;
- if (this.stickyInit)
+ this.noStickyResize = options.noWindowResize;
+ if (this.header && this.header.length)
+ this._makeStickyHeaders();
+}
+
+TreeGrid.prototype._makeStickyHeaders = function()
+{
+ var self = this;
+ makeStickyHeaders(this.table);
+ this.stickyInit = true;
+ this.table.className += ' stickyheaders';
+ if (!this.noStickyResize)
{
- makeStickyHeaders(this.table);
- this.table.className += ' stickyheaders';
+ addListener(window, 'resize', function()
+ {
+ if (self.stickyInit)
+ fixStickyColumnSizes(self.table);
+ });
}
}
@@ -111,11 +124,7 @@ TreeGrid.prototype.setHeader = function(newHeader)
if (this.sticky)
{
if (!this.stickyInit)
- {
- makeStickyHeaders(this.table);
- this.table.className += ' stickyheaders';
- this.stickyInit = true;
- }
+ this._makeStickyHeaders();
else
fixStickyHeader(this.table);
}
@@ -693,3 +702,5 @@ TreeGridNode.prototype.addChildren = function(nodes, insertBefore)
fixStickyRows(this.grid.table, trs);
return this.children.slice(insertBefore, nodes.length);
}
+
+;
diff --git a/treegridtest.htm b/treegridtest.htm
index 7d5c672..fcbff18 100644
--- a/treegridtest.htm
+++ b/treegridtest.htm
@@ -12,11 +12,11 @@ table { border-collapse: separate; border-spacing: 0px; }
th, td { border-width: 0 1px 1px 0 !important; }
table td:nth-child(1) { width: 25%; }
table.stickyheaders td:nth-child(2) { width: 25%; }
-.scroller { width: 100%; height: 400px; overflow: auto; }
+.scroller { width: 100%; height: 400px; }
-
+