@mixd-id/web-scaffold 0.1.230406189 → 0.1.230406191

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mixd-id/web-scaffold",
   "private": false,
-  "version": "0.1.230406189",
+  "version": "0.1.230406191",
   "scripts": {
     "dev": "vite serve",
     "build": "vite build",

package/src/components/Carousel.vue

@@ -97,7 +97,8 @@ export default{
   data(){
     return {
       index: 0,
-			timeoutId: null
+			timeoutId: null,
+      scrollPosition: null,
     }
   },
 
@@ -206,7 +207,7 @@ export default{
         }
         else if(Math.abs(dx) > 15){
           this._props['direction'] = 'horizontal'
-          document.body.classList.add(this.$style.noScroll)
+          this.disableBodyScroll()
         }
       }
       else if(this._props['direction'] === 'horizontal'){
@@ -232,6 +233,8 @@ export default{
         else{
           this.setPosition()
         }
+
+        this.enableBodyScroll()
       }
 
       window.removeEventListener('mousemove', this.mouseMove)
@@ -240,12 +243,26 @@ export default{
       window.removeEventListener('touchmove', this.mouseMove)
       window.removeEventListener('touchend', this.mouseUp)
 
-      document.body.classList.remove(this.$style.noScroll)
-
 			if(this.autoPlay > 0)
 				this.play()
     },
 
+    disableBodyScroll(){
+      this.scrollPosition = window.pageYOffset || document.documentElement.offsetTop
+      document.body.style.overflow = 'hidden';
+      document.body.style.position = 'fixed';
+      document.body.style.top = `-${this.scrollPosition}px`;
+      document.body.style.width = '100%';
+    },
+
+    enableBodyScroll(){
+      document.body.style.removeProperty('overflow');
+      document.body.style.removeProperty('position');
+      document.body.style.removeProperty('top');
+      document.body.style.removeProperty('width');
+      window.scrollTo(0, this.scrollPosition);
+    },
+
     mouseDown(e){
 			if(!this.items || this.items.length <= 1)
 				return
@@ -348,8 +365,7 @@ export default{
 	@apply bg-primary-500;
 }
 
-.noScroll{
-  overflow: hidden
+.bodyNoScroll{
 }
 
 @media screen(md){