Jelajahi Sumber

fix: 继续适配傻逼safari的缩放规律

任一存 1 tahun lalu
induk
melakukan
ed34b2b791
1 mengubah file dengan 5 tambahan dan 12 penghapusan
  1. 5 12
      src/views/ShuangGou.vue

+ 5 - 12
src/views/ShuangGou.vue

@@ -16,8 +16,6 @@
       :style="{
         left: hotspot1X + 'px',
         top: hotspot1Y + 'px',
-        width: hotspotSize + 'px',
-        height: hotspotSize + 'px',
       }"
       @click="onClickHotspot(1)"
     />
@@ -26,8 +24,6 @@
       :style="{
         left: hotspot2X + 'px',
         top: hotspot2Y + 'px',
-        width: hotspotSize + 'px',
-        height: hotspotSize + 'px',
       }"
       @click="onClickHotspot(2)"
     />
@@ -127,7 +123,6 @@ const hotspot1X = ref(-100)
 const hotspot1Y = ref(-100)
 const hotspot2X = ref(-100)
 const hotspot2Y = ref(-100)
-const hotspotSize = ref(0)
 function setHotspotPos() {
   const { x: x1, y: y1 } = utils.mapPosFromDraftToWindow({ x: 484, y: 420 }, 'cover', 1920, 972)
   hotspot1X.value = x1
@@ -135,8 +130,6 @@ function setHotspotPos() {
   const { x: x2, y: y2 } = utils.mapPosFromDraftToWindow({ x: 214, y: 700 }, 'cover', 1920, 972)
   hotspot2X.value = x2
   hotspot2Y.value = y2
-  const { x: size } = utils.mapPosFromDraftToWindow({ x: 48, y: 48 }, 'cover', 1920, 972)
-  hotspotSize.value = size
 }
 setHotspotPos()
 onMounted(() => {
@@ -203,7 +196,7 @@ const activeVideoIdx = ref(0)
       writing-mode: vertical-lr;
       font-family: KingHwa_OldSong, KingHwa_OldSong;
       font-weight: 400;
-      font-size: 6.17vh;
+      font-size: calc(60px / v-bind('windowHeightDesign') * v-bind('windowHeight'));
       color: #474747;
       letter-spacing: 0.2em;
     }
@@ -223,8 +216,8 @@ const activeVideoIdx = ref(0)
       right: 11vw;
     }
     >p{
-      font-size: calc(30 / 970 * 100vh);
-      line-height: calc(36 / 970 * 100vh);
+      font-size: calc(30px / v-bind('windowHeightDesign') * v-bind('windowHeight'));
+      line-height: calc(36px / v-bind('windowHeightDesign') * v-bind('windowHeight'));
       text-indent: 2em;
       font-family: KaiTi, KaiTi;
       font-weight: 400;
@@ -233,8 +226,8 @@ const activeVideoIdx = ref(0)
         font-family: KaiTi, KaiTi;
         font-weight: 400;
         color: #707F48;
-        font-size: calc(42 / 970 * 100vh);
-        line-height: calc(50 / 970 * 100vh);
+        font-size: calc(42px / v-bind('windowHeightDesign') * v-bind('windowHeight'));
+        line-height: calc(50px / v-bind('windowHeightDesign') * v-bind('windowHeight'));
       }
     }
     >p:nth-of-type(2) {