Add mutation observer to responsive/drilldown

diff --git a/js/foundation.drilldown.js b/js/foundation.drilldown.js
index feebac5c79896ef28926babbbde5d670816485fa..0072063f0945d5421acbaf84fa15832db952ccc9 100644 (file)
--- a/js/foundation.drilldown.js
+++ b/js/foundation.drilldown.js
@@ -47,6 +47,7 @@ class Drilldown {
     this.$submenuAnchors = this.$element.find('li.is-drilldown-submenu-parent').children('a');
     this.$submenus = this.$submenuAnchors.parent('li').children('[data-submenu]');
     this.$menuItems = this.$element.find('li').not('.js-drilldown-back').attr('role', 'menuitem').find('a');
+    this.$element.attr('data-mutate', (this.$element.attr('data-drilldown') || Foundation.GetYoDigits(6, 'drilldown')));
 
     this._prepareMenu();
     this._registerEvents();
@@ -96,6 +97,12 @@ class Drilldown {
     }
   }
 
+  _resize() {
+    this.$wrapper.css({'max-width': 'none', 'min-height': 'none'});
+    // _getMaxDims has side effects (boo) but calling it should update all other necessary heights & widths
+    this.$wrapper.css(this._getMaxDims());
+  }
+
   /**
    * Adds event handlers to elements in the menu.
    * @function
@@ -127,6 +134,7 @@ class Drilldown {
         });
       }
     });
+         this.$element.on('mutateme.zf.trigger', this._resize.bind(this));
   }
 
   /**
@@ -368,6 +376,7 @@ class Drilldown {
   destroy() {
     if(this.options.scrollTop) this.$element.off('.zf.drilldown',this._bindHandler);
     this._hideAll();
+         this.$element.off('mutateme.zf.trigger');
     Foundation.Nest.Burn(this.$element, 'drilldown');
     this.$element.unwrap()
                  .find('.js-drilldown-back, .is-submenu-parent-item').remove()

diff --git a/js/foundation.responsiveMenu.js b/js/foundation.responsiveMenu.js
index a7bb389a80590e3ffb4cc559f085f78b8694985b..1f991aa047988e1f7df1478bacbb4d70c896fcd0 100644 (file)
--- a/js/foundation.responsiveMenu.js
+++ b/js/foundation.responsiveMenu.js
@@ -62,6 +62,8 @@ class ResponsiveMenu {
     if (!$.isEmptyObject(this.rules)) {
       this._checkMediaQueries();
     }
+    // Add data-mutate since children may need it.
+    this.$element.attr('data-mutate', (this.$element.attr('data-mutate') || Foundation.GetYoDigits(6, 'responsive-menu')));
   }
 
   /**