From 34185d8d1f68fc39e90929850c65aa5d3c7a8b26 Mon Sep 17 00:00:00 2001
From: "DESKTOP-RQ919RC\\Pc" <1300399510@qq.com>
Date: Tue, 10 Jun 2025 15:48:55 +0800
Subject: [PATCH] =?UTF-8?q?style:=20=E4=BC=98=E5=8C=96=E5=B9=BB=E7=81=AF?=
 =?UTF-8?q?=E7=89=87=E9=A1=B9=E6=82=AC=E5=81=9C=E5=8A=A8=E7=94=BB=E6=95=88?=
 =?UTF-8?q?=E6=9E=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

将幻灯片项的遮罩动画从修改宽高改为缩放变换，使动画效果更平滑自然。同时统一了CSS和LESS文件的实现方式。
---
 src/assets/styles/apartmentDetail.css  | 16 ++++++++--------
 src/assets/styles/apartmentDetail.less | 16 ++++++++--------
 2 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/src/assets/styles/apartmentDetail.css b/src/assets/styles/apartmentDetail.css
index a2a15f5..2f3615f 100644
--- a/src/assets/styles/apartmentDetail.css
+++ b/src/assets/styles/apartmentDetail.css
@@ -152,21 +152,21 @@
 .content .header .header-content .header-left .slideshow-across .box .item::after {
   content: "";
   position: absolute;
-  top: 50%;
-  left: 50%;
+  top: 0;
+  left: 0;
   width: 100%;
   height: 100%;
   background-color: rgba(255, 255, 255, 0.50196078);
-  transform: translate(-50%, -50%);
-  transition: width 0.3s, height 0.3s;
+  transition: all 0.3s;
+  transform: scale(1);
 }
 .content .header .header-content .header-left .slideshow-across .box .item:hover::after {
-  width: 0;
-  height: 0;
+  transform-origin: center;
+  transform: scale(0);
 }
 .content .header .header-content .header-left .slideshow-across .box .item.pitch::after {
-  width: 0;
-  height: 0;
+  transform-origin: center;
+  transform: scale(0);
 }
 .content .header .header-content .header-left .slideshow-across .box .item .video-icon {
   width: 44px;
diff --git a/src/assets/styles/apartmentDetail.less b/src/assets/styles/apartmentDetail.less
index 592e89f..f3fb6ea 100644
--- a/src/assets/styles/apartmentDetail.less
+++ b/src/assets/styles/apartmentDetail.less
@@ -180,24 +180,24 @@
                             &::after {
                                 content: "";
                                 position: absolute;
-                                top: 50%;
-                                left: 50%;
+                                top: 0;
+                                left: 0;
                                 width: 100%;
                                 height: 100%;
                                 background-color: rgba(255, 255, 255, 0.501960784313725);
-                                transform: translate(-50%, -50%);
-                                transition: width 0.3s, height 0.3s;
+                                transition: all 0.3s;
+                                transform: scale(1);
                             }
 
                             &:hover::after {
-                                width: 0;
-                                height: 0;
+                                transform-origin: center;
+                                transform: scale(0);
                             }
 
                             &.pitch {
                                 &::after {
-                                    width: 0;
-                                    height: 0;
+                                    transform-origin: center;
+                                    transform: scale(0);
                                 }
                             }