123

2 years ago · e59ff1a855
8 changed files with 28 additions and 34 deletions
--- a/README.md
+++ b/README.md
@ -1 +1,13 @@

+常用
+1280 x 800
+1366 x 1024 (IPad Pro)
+1440 x 900
+1680 x 1050
+1600 x 900
+1920 x 1200
+2560 x 1440
+更高忽略
+2880 x 1620
+3200 x 1800
+5120 x 2880
--- a/index.html
+++ b/index.html
@ -2,7 +2,10 @@
 <html lang="en">
  <head>
    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta
+      name="viewport"
+      content="width=device-width; initial-scale=1; maximum-scale=1; minimum-scale=1; user-scalable=no;"
+    />
    <title>产品梦工厂</title>
  </head>
  <body>
--- a/src/common/utils.js
+++ b/src/common/utils.js
@ -10,28 +10,14 @@ const scaleFunc = (showEmpty, id, origin, scale) => {
 }

 export const handleScreenAuto = (showEmpty, id, origin) => {
-  const clientWidth = document.documentElement.clientWidth
  const clientHeight = document.documentElement.clientHeight
-  if (clientWidth > 1600) {
+  const clientWidth = document.documentElement.clientWidth
  if (clientHeight < 1080) {
-      const scale = clientHeight / 1080
-      scaleFunc(showEmpty, id, origin, scale)
-    } else {
-      if (clientHeight >= 1764) {
-        const scale = 1323 / clientHeight
+    const scale = (clientHeight / 1080).toFixed(3)
    scaleFunc(showEmpty, id, origin, scale)
  } else {
-        if (clientHeight >= 1323) {
-          const scale = 1176 / clientHeight
+    const scale = ((clientHeight - 180) / 1080).toFixed(3)
    scaleFunc(showEmpty, id, origin, scale)
-        } else {
-          const scale = 1080 / clientHeight
-          scaleFunc(showEmpty, id, origin, scale)
-        }
-      }
-    }
-  } else {
-    showEmpty.value = true
  }
 }

@ -88,14 +74,6 @@ export const animateCSS = (element, animation, prefix = 'animate__') =>
 export const totalPageAni = async (activeIndex, previousIndex) => {
  const isDown = previousIndex < activeIndex
  const aniName = isDown ? 'fadeInUp' : 'fadeInDown'
-  if (activeIndex == 0) {
-    // animateCSS('#main_img', 'fadeInUp')
-    // animateCSS('#slide_five_desc_ani', 'fadeInUp')
-    // animateCSS('#slide_two_ani', 'fadeInDown')
-    // animateCSS('#slide_one_ani', 'fadeInDown')
-    // animateCSS('#slide_three_ani', 'fadeInDown')
-    // animateCSS('#slide_four_ani', 'fadeInDown')
-  }
  if (activeIndex == 1) {
    animateCSS('#servive_big_title_ani', aniName)
  }
@ -105,13 +83,9 @@ export const totalPageAni = async (activeIndex, previousIndex) => {
  if (activeIndex == 3) {
    animateCSS('#case_picture_list_ani', aniName)
  }
-  if (activeIndex == 4) {
-  }
  if (activeIndex == 5) {
    animateCSS('#contract_ani', aniName)
  }
-  if (activeIndex == 6) {
-  }
  if (activeIndex == 7) {
    animateCSS('#software_b_ani', aniName)
    animateCSS('#software_c_ani', aniName)
--- a/src/style.scss
+++ b/src/style.scss
@ -73,6 +73,7 @@ body {
 .swiper {
  width: 100%;
  height: 100%;
+  min-width: 1280px;
 }

 .swiper-slide {
--- a/src/views/Index/components/Culture/Card/index.vue
+++ b/src/views/Index/components/Culture/Card/index.vue
@ -145,6 +145,7 @@ const getTips = () => {
        .new_btn {
          background: #283fe7;
          font-size: 20px;
+          white-space: nowrap;
          font-family: 'SourceHanSans';
          font-weight: 400;
          color: #ffffff;
@ -154,6 +155,7 @@ const getTips = () => {
    }
    .header_card {
      .btn {
+        white-space: nowrap;
        border: 2px solid #ffffff;
        font-size: 18px;
        font-family: 'SourceHanSans';
--- a/src/views/Index/components/HeaderSwiper/index.vue
+++ b/src/views/Index/components/HeaderSwiper/index.vue
@ -136,7 +136,7 @@ export default {
  width: 100%;
  height: 100%;
  position: relative;
-  min-width: 1668px;
+  min-width: 1280;
  background: #000;
  .down_circle {
    position: absolute;
--- a/src/views/Index/components/Recruit/Card/index.vue
+++ b/src/views/Index/components/Recruit/Card/index.vue
@ -89,6 +89,7 @@ const getClass = () => {
    .desc {
      flex: 1;
      font-size: 16px;
+      line-height: 24.73px;
      width: 195px;
      font-family: 'SourceHanSans';
      font-weight: 300;
--- a/vite.config.js
+++ b/vite.config.js
@ -71,6 +71,7 @@ export default defineConfig({
        postcsspxtoviewport({
          unitToConvert: 'px', // 要转化的单位
          viewportWidth: 1920, // UI设计稿的宽度
+          viewportHeight: 1080, // UI设计稿高度
          unitPrecision: 6, // 转换后的精度，即小数点位数
          propList: ['*'], // 指定转换的css属性的单位，*代表全部css属性的单位都进行转换
          viewportUnit: 'vw', // 指定需要转换成的视窗单位，默认vw