added support for hidden elements, closes #12

5 files changed, 69 insertions, 9 deletions

diff --git a/README.md b/README.md
index 342660e..24d62ea 100644
--- a/README.md
+++ b/README.md
@@ -18,8 +18,9 @@ See the [jquery.matchHeight.js demo](http://brm.io/jquery-match-height-demo).
 - row aware, handles floating elements
 - responsive, automatically updates on window resize (can be throttled for performance)
 - handles mixed `padding`, `margin`, `border` values (even if every element has them different)
-- accounts for `box-sizing`
 - handles images and other media (updates automatically after loading)
+- handles hidden or none-visible elements (e.g. those inside tab controls)
+- accounts for `box-sizing`
 - data attributes API
 - tested in IE8+, Chrome, Firefox, Chrome Android
 - can be removed when needed
diff --git a/jquery.matchHeight-min.js b/jquery.matchHeight-min.js
index f0eea34..07d4ba5 100644
--- a/jquery.matchHeight-min.js
+++ b/jquery.matchHeight-min.js
@@ -3,7 +3,7 @@
 * http://brm.io/jquery-match-height/
 * License: MIT
 */
-(function(b){b.fn.matchHeight=function(a){if("remove"===a){var d=this;this.css("height","");b.each(b.fn.matchHeight._groups,function(b,a){a.elements=a.elements.not(d)});return this}if(1>=this.length)return this;a="undefined"!==typeof a?a:!0;b.fn.matchHeight._groups.push({elements:this,byRow:a});b.fn.matchHeight._apply(this,a);return this};b.fn.matchHeight._apply=function(a,d){var c=b(a),e=[c];d&&(c.css({display:"block","padding-top":"0","padding-bottom":"0","border-top-width":"0","border-bottom-width":"0",
-height:"100px"}),e=k(c),c.css({display:"","padding-top":"","padding-bottom":"","border-top-width":"","border-bottom-width":"",height:""}));b.each(e,function(a,c){var d=b(c),e=0;d.each(function(){var a=b(this);a.css({display:"block",height:""});a.outerHeight(!1)>e&&(e=a.outerHeight(!1));a.css({display:""})});d.each(function(){var a=b(this),c=0;"border-box"!==a.css("box-sizing")&&(c+=g(a.css("border-top-width"))+g(a.css("border-bottom-width")),c+=g(a.css("padding-top"))+g(a.css("padding-bottom")));
-a.css("height",e-c)})});return this};b.fn.matchHeight._applyDataApi=function(){var a={};b("[data-match-height], [data-mh]").each(function(){var d=b(this),c=d.attr("data-match-height");a[c]=c in a?a[c].add(d):d});b.each(a,function(){this.matchHeight(!0)})};b.fn.matchHeight._groups=[];b.fn.matchHeight._throttle=80;var h=-1,f=-1;b.fn.matchHeight._update=function(a){if(a&&"resize"===a.type){a=b(window).width();if(a===h)return;h=a}-1===f&&(f=setTimeout(function(){b.each(b.fn.matchHeight._groups,function(){b.fn.matchHeight._apply(this.elements,
-this.byRow)});f=-1},b.fn.matchHeight._throttle))};b(b.fn.matchHeight._applyDataApi);b(window).bind("load resize orientationchange",b.fn.matchHeight._update);var k=function(a){var d=null,c=[];b(a).each(function(){var a=b(this),f=a.offset().top-g(a.css("margin-top")),h=0<c.length?c[c.length-1]:null;null===h?c.push(a):1>=Math.floor(Math.abs(d-f))?c[c.length-1]=h.add(a):c.push(a);d=f});return c},g=function(a){return parseFloat(a)||0}})(jQuery);
\ No newline at end of file
+(function(b){b.fn.matchHeight=function(a){if("remove"===a){var d=this;this.css("height","");b.each(b.fn.matchHeight._groups,function(b,a){a.elements=a.elements.not(d)});return this}if(1>=this.length)return this;a="undefined"!==typeof a?a:!0;b.fn.matchHeight._groups.push({elements:this,byRow:a});b.fn.matchHeight._apply(this,a);return this};b.fn.matchHeight._apply=function(a,d){var c=b(a),f=[c];d&&(c.css({display:"block","padding-top":"0","padding-bottom":"0","border-top-width":"0","border-bottom-width":"0",
+height:"100px"}),f=k(c),c.css({display:"","padding-top":"","padding-bottom":"","border-top-width":"","border-bottom-width":"",height:""}));b.each(f,function(a,c){var d=b(c),f=0,e=d.parents().add(d).filter(":hidden");e.css({display:"block"});d.each(function(){var a=b(this);a.css({display:"block",height:""});a.outerHeight(!1)>f&&(f=a.outerHeight(!1));a.css({display:""})});e.css({display:""});d.each(function(){var a=b(this),c=0;"border-box"!==a.css("box-sizing")&&(c+=g(a.css("border-top-width"))+g(a.css("border-bottom-width")),
+c+=g(a.css("padding-top"))+g(a.css("padding-bottom")));a.css("height",f-c)})});return this};b.fn.matchHeight._applyDataApi=function(){var a={};b("[data-match-height], [data-mh]").each(function(){var d=b(this),c=d.attr("data-match-height");a[c]=c in a?a[c].add(d):d});b.each(a,function(){this.matchHeight(!0)})};b.fn.matchHeight._groups=[];b.fn.matchHeight._throttle=80;var h=-1,e=-1;b.fn.matchHeight._update=function(a){if(a&&"resize"===a.type){a=b(window).width();if(a===h)return;h=a}-1===e&&(e=setTimeout(function(){b.each(b.fn.matchHeight._groups,
+function(){b.fn.matchHeight._apply(this.elements,this.byRow)});e=-1},b.fn.matchHeight._throttle))};b(b.fn.matchHeight._applyDataApi);b(window).bind("load resize orientationchange",b.fn.matchHeight._update);var k=function(a){var d=null,c=[];b(a).each(function(){var a=b(this),e=a.offset().top-g(a.css("margin-top")),h=0<c.length?c[c.length-1]:null;null===h?c.push(a):1>=Math.floor(Math.abs(d-e))?c[c.length-1]=h.add(a):c.push(a);d=e});return c},g=function(a){return parseFloat(a)||0}})(jQuery);
\ No newline at end of file
diff --git a/jquery.matchHeight.js b/jquery.matchHeight.js
index 030e159..367df93 100644
--- a/jquery.matchHeight.js
+++ b/jquery.matchHeight.js
@@ -78,6 +78,10 @@
             var $row = $(row),
                 maxHeight = 0;
 
+            // ensure elements are visible to prevent 0 height
+            var hiddenParents = $row.parents().add($row).filter(':hidden');
+            hiddenParents.css({ 'display': 'block' });
+
             // iterate the row and find the max height
             $row.each(function(){
                 var $that = $(this);
@@ -93,6 +97,9 @@
                 $that.css({ 'display': '' });
             });
 
+            // revert display block
+            hiddenParents.css({ 'display': '' });
+
             // iterate the row and apply the height to all elements
             $row.each(function(){
                 var $that = $(this),
diff --git a/test.css b/test.css
index 7fa088a..5ce6e16 100644
--- a/test.css
+++ b/test.css
@@ -72,7 +72,8 @@ a, a:link, a:visited, a:active, a:hover {
     margin: 5px 20px 5px 0;
 }
 
-.test-remove {
+.btn-remove,
+.btn-hidden {
     margin: -8px 20px 0 20px;
     line-height: 1;
     border: 0;
@@ -236,4 +237,16 @@ a, a:link, a:visited, a:active, a:hover {
         margin-left: 0;
         margin-right: 0;
     }
+}
+
+/* test hidden */
+
+.test-hidden .hidden-items > .item-0,
+.test-hidden .hidden-items > .item-2 {
+    display: none;
+}
+
+.test-hidden .hidden-items > .item-1,
+.test-hidden .hidden-items > .item-3 {
+    visibility: hidden;
 }
\ No newline at end of file
diff --git a/test.html b/test.html
index 1da2ae3..53e40f0 100644
--- a/test.html
+++ b/test.html
@@ -30,17 +30,22 @@
                     });
 
                     // example of removing matchHeight
-                    $('.test-remove').click(function() {
+                    $('.btn-remove').click(function() {
                         $('.items-container').each(function() {
                             $(this).children('.item').matchHeight('remove');
                         });
                     });
+
+                    // button to show hidden elements
+                    $('.btn-hidden').click(function() {
+                        $('body').removeClass('test-hidden');
+                    });
                 });
 
             })();
         </script>
     </head>
-    <body class="test-match-height test-rows test-responsive test-border-box test-margin test-padding">
+    <body class="test-match-height test-rows test-responsive test-border-box test-margin test-padding test-hidden">
         <div class="container">
             <h1>jquery.matchHeight Tests</h1>
 
@@ -86,7 +91,12 @@
                 </div>
                 <div class="checkbox">
                     <label>
-                        <input class="test-remove" type="submit" value="remove matchHeight">
+                        <input class="btn-remove" type="submit" value="remove matchHeight">
+                    </label>
+                </div>
+                <div class="checkbox">
+                    <label>
+                        <input class="btn-hidden" type="submit" value="show hidden">
                     </label>
                 </div>
             </div>
@@ -206,6 +216,35 @@
                     <p>Fixed height</p>
                 </div>
             </div>
+
+            <div class="items-container hidden-items">
+                <div class="item item-0">
+                    <p>display: none</p>
+                </div>
+                <div class="item item-1">
+                    <p>visibility: hidden</p>
+                </div>
+                <div class="item item-2">
+                    <div class="items-container">
+                        <div class="item item-0">
+                            <p>parent display: none</p>
+                        </div>
+                        <div class="item item-0">
+                            <p>parent display: none</p>
+                        </div>
+                    </div>
+                </div>
+                <div class="item item-3">
+                    <div class="items-container">
+                        <div class="item item-1">
+                            <p>parent visibility: hidden</p>
+                        </div>
+                        <div class="item item-1">
+                            <p>parent visibility: hidden</p>
+                        </div>
+                    </div>
+                </div>
+            </div>
         </div>
     </body>
 </html>
\ No newline at end of file