@whitesev/pops 2.0.4 → 2.0.6

package/dist/types/src/components/loading/indexType.d.ts

@@ -20,4 +20,11 @@ export interface PopsLoadingDetails extends Omit<PopsCommonConfig, "width" | "he
      * （可选）添加主CSS，默认为true，当页面中存在anim覆盖时，可能会有一些样式问题，取消添加该CSS即可解决
      */
     addIndexCSS?: boolean;
+    /**
+     * 为pops-anim和pops-mask设置position: absolute（需要自行设置parent的position为relative）
+     *
+     * 它们默认的position为fixed
+     * @default false
+     */
+    isAbsolute?: boolean;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@whitesev/pops",
-  "version": "2.0.4",
+  "version": "2.0.6",
   "description": "弹窗库",
   "main": "dist/index.cjs.js",
   "module": "dist/index.esm.js",

package/src/components/loading/config.ts

@@ -22,7 +22,7 @@ export const PopsLoadingConfig = (): DeepRequired<PopsLoadingDetails> => {
 		},
 		animation: "pops-anim-fadein-zoom",
 		forbiddenScroll: false,
-
+		isAbsolute: false,
 		style: null,
 		addIndexCSS: true,
 	};

package/src/components/loading/index.ts

@@ -79,9 +79,6 @@ export class PopsLoading {
 				maskHTML: maskHTML,
 			});
 			$mask = _handleMask_.maskElement;
-			// 遮罩层必须是跟随主内容
-			// 即设置主内容position: relative，mask：position: absolute
-			popsDOMUtils.css($mask, "position", "absolute !important");
 			elementList.push($mask);
 		}
 		let eventDetails = PopsHandler.handleLoadingEventDetails(
@@ -103,6 +100,12 @@ export class PopsLoading {
 			maskElement: $mask!,
 		} as any);
 
+		if (config.isAbsolute) {
+			// 遮罩层必须是跟随主内容
+			// 即设置主内容position: relative，mask：position: absolute
+			popsDOMUtils.css($anim, "position", "absolute !important");
+			$mask && popsDOMUtils.css($mask, "position", "absolute !important");
+		}
 		return PopsHandler.handleResultDetails(eventDetails);
 	}
 }

package/src/components/loading/indexType.ts

@@ -28,4 +28,11 @@ export interface PopsLoadingDetails
 	 * （可选）添加主CSS，默认为true，当页面中存在anim覆盖时，可能会有一些样式问题，取消添加该CSS即可解决
 	 */
 	addIndexCSS?: boolean;
+	/**
+	 * 为pops-anim和pops-mask设置position: absolute（需要自行设置parent的position为relative）
+	 *
+	 * 它们默认的position为fixed
+	 * @default false
+	 */
+	isAbsolute?: boolean;
 }