feat: .

src/views/home/iframeView/index.vue

@@ -95,7 +95,6 @@ nextTick(() => {
   top: 0;
   left: 50%;
   transform: translateX(-50%);
-  max-width: 596px;
   background-size: cover;
   background-repeat: no-repeat;
   background-position: 50%;
@@ -103,7 +102,6 @@ nextTick(() => {
   color: #fff;
   overflow-x: hidden;
   z-index: 101;
-  margin: 0 auto;
   .iframe-box {
     width: 100%;
     height: 100%;
@@ -147,6 +145,7 @@ nextTick(() => {
     bottom: 0;
     left: 0;
     width: 100%;
+    z-index: 10;
     .scroll-box {
       width: 100%;
       max-height: 5.3333rem;
@@ -213,7 +212,22 @@ nextTick(() => {
 }
 .swiper-dom {
   width: 100%;
+  height: 100%;
   overflow: visible !important;
   padding: 0 20px;
+  .item-box {
+    width: 100%;
+    height: calc(100% - 20px);
+  }
+}
+
+@media screen and (min-width: 900px) {
+  .iframe-view {
+    max-width: 596px;
+    margin: 0 auto;
+  }
+}
+@media screen and (min-height: 1024px) {
+
 }
 </style>

src/views/home/index.vue

@@ -376,10 +376,13 @@ onMounted(() => {
   background-position: 50%;
   background-image: url("@/assets/img/home_bg.jpg");
   color: #fff;
-
+  position: fixed;
+  top: 0;
+  left: 50%;
+  transform: translateX(-50%);
   .title {
     text-align: center;
-    margin: .8rem auto 1.4667rem;
+    margin: 0.8rem auto 1.4667rem;
     width: 8.2133rem;
     height: 2.0667rem;
     background: url("@/assets/img/home_title.svg") no-repeat;
@@ -389,6 +392,7 @@ onMounted(() => {
   .item-box {
     // display: flex;
     position: relative;
+    height: 20vh;
     img {
       object-fit: contain;
       width: 100%;
@@ -531,7 +535,7 @@ onMounted(() => {
 .swiper-dom {
   width: 100%;
   /* margin-top: 10px; */
-  margin-bottom:15%;
+  margin-bottom: 2%;
   overflow: visible !important;
   padding: 0 40px;
 }
@@ -540,12 +544,29 @@ onMounted(() => {
   .home {
     max-width: 596px;
     margin: 0 auto;
-    .title{
+    .title {
       margin: 30px auto 55px;
     }
   }
   .swiper-dom {
-    margin-bottom: 5%;
+    margin-bottom: 2%;
+    .item-box{
+      height: 20vh;
+    }
+  }
+}
+@media screen and (min-height: 1024px) {
+  .home {
+    .title {
+      margin: 30px auto 40px;
+    }
+  }
+  .swiper-dom {
+    margin-bottom: 20px;
+
+    .item-box{
+      height: 20vh;
+    }
   }
 }
 </style>