fix: reset the padding right of the body when sizing

Fixed #379

CHANGELOG.md

@@ -4,6 +4,7 @@
 
 - Ignore images without the `src` attribute (#326).
 - Improve the `hide` method for unexpected calling (#367).
+- Reset the padding right of the `body` element when resizing (#379).
 - Remove unnecessary `padding-right: 0px` from the `body` element when close the viewer modal (#394).
 
 ## 1.5.0 (Nov 23, 2019)

src/js/handlers.js

@@ -439,6 +439,12 @@ export default {
       return;
     }
 
+    if (this.fulled) {
+      this.close();
+      this.initBody();
+      this.open();
+    }
+
     this.initContainer();
     this.initViewer();
     this.renderViewer();

src/js/render.js

@@ -29,6 +29,16 @@ export default {
     this.renderViewer();
   },
 
+  initBody() {
+    const { ownerDocument } = this.element;
+    const body = ownerDocument.body || ownerDocument.documentElement;
+
+    this.body = body;
+    this.scrollbarWidth = window.innerWidth - ownerDocument.documentElement.clientWidth;
+    this.initialBodyPaddingRight = body.style.paddingRight;
+    this.initialBodyComputedPaddingRight = window.getComputedStyle(body).paddingRight;
+  },
+
   initContainer() {
     this.containerData = {
       width: window.innerWidth,

src/js/viewer.js

@@ -104,14 +104,7 @@ class Viewer {
     this.isImg = isImg;
     this.length = images.length;
     this.images = images;
-
-    const { ownerDocument } = element;
-    const body = ownerDocument.body || ownerDocument.documentElement;
-
-    this.body = body;
-    this.scrollbarWidth = window.innerWidth - ownerDocument.documentElement.clientWidth;
-    this.initialBodyPaddingRight = body.style.paddingRight;
-    this.initialBodyComputedPaddingRight = window.getComputedStyle(body).paddingRight;
+    this.initBody();
 
     // Override `transition` option if it is not supported
     if (isUndefined(document.createElement(NAMESPACE).style.transition)) {