fixed issue foundation#7831

based on https://stackoverflow.com/a/13891717/968244

js/foundation.reveal.js

@@ -179,6 +179,29 @@ class Reveal extends Plugin {
     else{ this.close(); }
   }
 
+  /**
+  * Disables the scroll when Reveal is shown to prevent the background from shifting
+  */
+  _disableScroll(){
+    if ($(document).height() > $(window).height()) {
+      var scrollTop = $(window).scrollTop();
+      $("html")
+        .addClass("disable-scroll")
+        .css("top", -scrollTop);
+    }
+  }
+
+  /**
+  * Reenables the scroll when Reveal closes
+  */
+  _enableScroll(){
+    var scrollTop = parseInt($("html").css("top"));
+    $("html")
+      .removeClass("disable-scroll")
+      .css("top", "");
+    $(window).scrollTop(-scrollTop);
+  }
+
 
   /**
    * Opens the modal controlled by `this.$anchor`, and closes all others by default.
@@ -238,6 +261,8 @@ class Reveal extends Plugin {
       this.$element.trigger('closeme.zf.reveal', this.id);
     }
 
+    this._disableScroll();
+
     var _this = this;
 
     function addRevealOpenClasses() {
@@ -395,6 +420,8 @@ class Reveal extends Plugin {
 
       _this.$element.attr('aria-hidden', true);
 
+      _this._enableScroll();
+
       /**
       * Fires when the modal is done closing.
       * @event Reveal#closed

scss/components/_reveal.scss

@@ -178,3 +178,11 @@ $reveal-overlay-background: rgba($black, 0.45) !default;
     }
   }
 }
+
+
+/// Disables the scroll when Reveal is shown to prevent the background from shifting
+html.disable-scroll {
+    position: fixed;
+    width: 100%;
+    overflow-y: scroll;
+}