materialbox.js in materialize-sass-0.97.2

- old
+ new

@@ -16,10 +16,12 @@
       var outDuration = 200;
       var origin = $(this);
       var placeholder = $('<div></div>').addClass('material-placeholder');
       var originalWidth = 0;
       var originalHeight = 0;
+      var ancestorsChanged;
+      var ancestor;
       origin.wrap(placeholder);
 
 
       origin.on('click', function(){
         var placeholder = origin.parent('.material-placeholder');
@@ -44,21 +46,36 @@
         doneAnimating = false;
         origin.addClass('active');
         overlayActive = true;
 
         // Set positioning for placeholder
-
         placeholder.css({
           width: placeholder[0].getBoundingClientRect().width,
           height: placeholder[0].getBoundingClientRect().height,
           position: 'relative',
           top: 0,
           left: 0
         });
 
+        // Find ancestor with overflow: hidden; and remove it
+        ancestorsChanged = undefined;
+        ancestor = placeholder[0].parentNode;
+        var count = 0;
+        while (ancestor !== null && !$(ancestor).is(document)) {
+          var curr = $(ancestor);
+          if (curr.css('overflow') === 'hidden') {
+            curr.css('overflow', 'visible');
+            if (ancestorsChanged === undefined) {
+              ancestorsChanged = curr;
+            }
+            else {
+              ancestorsChanged = ancestorsChanged.add(curr);
+            }
+          }
+          ancestor = ancestor.parentNode;
+        }
 
-
         // Set css on origin
         origin.css({position: 'absolute', 'z-index': 1000})
         .data('width', originalWidth)
         .data('height', originalHeight);
 
@@ -233,9 +250,12 @@
 
               // Remove class
               origin.removeClass('active');
               doneAnimating = true;
               $(this).remove();
+
+              // Remove overflow overrides on ancestors
+              ancestorsChanged.css('overflow', '');
             }
           });
 
         }
         });