lanxin 5 часов назад
Родитель
Сommit
20207fcf28

BIN
public/myData/img/gongyangren.jpg


BIN
public/myData/img/yinxianke2.jpeg


Разница между файлами не показана из-за своего большого размера
+ 70 - 142
public/myData/myData.js


Разница между файлами не показана из-за своего большого размера
+ 74 - 145
public/myData/myDataEN.js


BIN
public/myData/weijie.mp3


BIN
src/assets/img/A6_sangzang_geshi1.png


BIN
src/assets/img/A6_sangzang_left_tab1.png


+ 3 - 1
src/assets/styles/base.css

@@ -91,6 +91,7 @@ body #A7Back > img {
   object-fit: contain;
 }
 .ant-image-preview-img-wrapper .previewImage .ImgFromTxt {
+  display: none !important;
   width: 80%;
   height: 3%;
   text-align: center;
@@ -270,6 +271,7 @@ textarea {
     transform: rotate(90deg) scale(0.65) !important;
   }
   .ant-image-preview-img-wrapper .previewImage .ImgFromTxt {
+    display: none !important;
     position: absolute;
     top: 50%;
     left: 50%;
@@ -555,7 +557,7 @@ textarea {
   font-family: 'heiti';
 }
 #Weijie {
-  animation: Weijie 3s linear forwards;
+  animation: Weijie 9s linear forwards;
 }
 @keyframes Weijie {
   0% {

+ 5 - 7
src/assets/styles/base.less

@@ -113,6 +113,7 @@ body #A7Back {
       }
     }
     .ImgFromTxt {
+      display: none !important;
       width: 80%;
       height: 3%;
       text-align: center;
@@ -224,15 +225,11 @@ textarea {
 
 // 默认字体
 .sizeNo {
-  font-family:
-    'Microsoft Yahei', 'PingFang SC', 'Avenir', 'Segoe UI', 'Hiragino Sans GB', 'STHeiti',
-    'Microsoft Sans Serif', 'WenQuanYi Micro Hei', sans-serif !important;
+  font-family: 'Microsoft Yahei', 'PingFang SC', 'Avenir', 'Segoe UI', 'Hiragino Sans GB', 'STHeiti', 'Microsoft Sans Serif', 'WenQuanYi Micro Hei', sans-serif !important;
 }
 
 .adm-auto-center-content {
-  font-family:
-    'Microsoft Yahei', 'PingFang SC', 'Avenir', 'Segoe UI', 'Hiragino Sans GB', 'STHeiti',
-    'Microsoft Sans Serif', 'WenQuanYi Micro Hei', sans-serif !important;
+  font-family: 'Microsoft Yahei', 'PingFang SC', 'Avenir', 'Segoe UI', 'Hiragino Sans GB', 'STHeiti', 'Microsoft Sans Serif', 'WenQuanYi Micro Hei', sans-serif !important;
   font-size: 16px;
   letter-spacing: 3px;
   text-align: center;
@@ -338,6 +335,7 @@ textarea {
         }
       }
       .ImgFromTxt {
+        display: none !important;
         position: absolute;
         top: 50%;
         left: 50%;
@@ -712,7 +710,7 @@ textarea {
 
 // 未解之思页面动画效果
 #Weijie {
-  animation: Weijie 3s linear forwards;
+  animation: Weijie 9s linear forwards;
 }
 
 @keyframes Weijie {

+ 5 - 25
src/pages/A6ybwx/A6_1_zxys/index.module.scss

@@ -229,18 +229,8 @@
           width: 0px;
           height: 0px;
         }
-        mask-image: linear-gradient(
-          to bottom,
-          rgba(0, 0, 0, 1) 0%,
-          rgba(0, 0, 0, 1) 80%,
-          /* 保留顶部70%不透明 */ rgba(0, 0, 0, 0) 100% /* 底部30%完全透明 */
-        );
-        -webkit-mask-image: linear-gradient(
-          to bottom,
-          rgba(0, 0, 0, 1) 0%,
-          rgba(0, 0, 0, 1) 80%,
-          rgba(0, 0, 0, 0) 100%
-        );
+        mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 80%, /* 保留顶部70%不透明 */ rgba(0, 0, 0, 0) 100% /* 底部30%完全透明 */);
+        -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 80%, rgba(0, 0, 0, 0) 100%);
       }
     }
   }
@@ -422,7 +412,7 @@
             display: flex;
             justify-content: center;
             align-items: center;
-
+            cursor: pointer;
             & > img {
               height: 20px;
               width: 20px;
@@ -613,18 +603,8 @@
           width: 0px;
           height: 0px;
         }
-        mask-image: linear-gradient(
-          to bottom,
-          rgba(0, 0, 0, 1) 0%,
-          rgba(0, 0, 0, 1) 80%,
-          /* 保留顶部70%不透明 */ rgba(0, 0, 0, 0) 100% /* 底部30%完全透明 */
-        );
-        -webkit-mask-image: linear-gradient(
-          to bottom,
-          rgba(0, 0, 0, 1) 0%,
-          rgba(0, 0, 0, 1) 80%,
-          rgba(0, 0, 0, 0) 100%
-        );
+        mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 80%, /* 保留顶部70%不透明 */ rgba(0, 0, 0, 0) 100% /* 底部30%完全透明 */);
+        -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 80%, rgba(0, 0, 0, 0) 100%);
       }
 
       .preview {

+ 28 - 84
src/pages/A6ybwx/Sangzang/components/Sangzangys/index.module.scss

@@ -26,8 +26,7 @@
       .lHidding {
         width: 300px;
         height: 100%;
-        background: url('../../../../../assets/img/A6_sangzang_hidContent.png') no-repeat center
-          center;
+        background: url('../../../../../assets/img/A6_sangzang_hidContent.png') no-repeat center center;
         background-size: 100% 100%;
         position: absolute;
         z-index: 1;
@@ -47,8 +46,7 @@
           height: 100%;
           display: flex;
           align-items: center;
-          background: url('../../../../../assets/img/A6_sangzang_hidding_left.png') no-repeat center
-            center;
+          background: url('../../../../../assets/img/A6_sangzang_hidding_left.png') no-repeat center center;
           background-size: 100% 100%;
           transition: all 0.6s ease-in-out;
 
@@ -70,8 +68,7 @@
               .pic {
                 width: 100%;
                 height: 100%;
-                background: url('../../../../../assets/img/A6_sangzang_mzw0.png') no-repeat center
-                  center;
+                background: url('../../../../../assets/img/A6_sangzang_mzw0.png') no-repeat center center;
                 background-size: contain;
               }
 
@@ -107,6 +104,7 @@
             }
 
             .txt {
+              display: none;
               line-height: 16px;
               font-size: 11px;
               height: 19px;
@@ -198,8 +196,7 @@
             .pic {
               width: 100%;
               height: 100%;
-              background: url('../../../../../assets/img/A6_sangzang_mzw1.png') no-repeat center
-                center;
+              background: url('../../../../../assets/img/A6_sangzang_mzw1.png') no-repeat center center;
               background-size: contain;
             }
 
@@ -239,6 +236,7 @@
             line-height: 11px;
             font-size: 11px;
             color: #9d9a90;
+            display: none;
           }
 
           .title {
@@ -268,8 +266,7 @@
 
           .openPic {
             opacity: 0;
-            background: url('../../../../../assets/img/A6_sangzang_hidRight.png') no-repeat center
-              center;
+            background: url('../../../../../assets/img/A6_sangzang_hidRight.png') no-repeat center center;
             background-size: 100% 100%;
             height: 100%;
             width: 100%;
@@ -431,8 +428,7 @@
           right: -2%;
 
           .openPic {
-            background: url('../../../../../assets/img/A6_sangzang_hidLeft.png') no-repeat center
-              center;
+            background: url('../../../../../assets/img/A6_sangzang_hidLeft.png') no-repeat center center;
             background-size: 100% 100%;
             animation: opacityChange 3s infinite ease-in-out;
           }
@@ -479,8 +475,7 @@
       .lHidding {
         width: 330px;
         transform: translate(-7%, -50%);
-        background: url('../../../../../assets/img/A6_sangzang_hidContent_r.png') no-repeat center
-          center;
+        background: url('../../../../../assets/img/A6_sangzang_hidContent_r.png') no-repeat center center;
         background-size: 100% 105%;
 
         .lHidding_left {
@@ -531,8 +526,7 @@
         .lHidding_right {
           .imgBox {
             .pic {
-              background: url('../../../../../assets/img/A6_sangzang_mzw2.png') no-repeat center
-                center;
+              background: url('../../../../../assets/img/A6_sangzang_mzw2.png') no-repeat center center;
               background-size: 100% 100%;
             }
           }
@@ -577,8 +571,7 @@
           width: 300px;
           .imgBox {
             .pic {
-              background: url('../../../../../assets/img/A6_sangzang_mzw3.png') no-repeat center
-                center;
+              background: url('../../../../../assets/img/A6_sangzang_mzw3.png') no-repeat center center;
               background-size: 100% 100%;
             }
           }
@@ -952,18 +945,8 @@
           color: rgba(255, 255, 255, 1);
           overflow: auto;
           font-weight: 400;
-          mask-image: linear-gradient(
-            to bottom,
-            rgba(0, 0, 0, 1) 0%,
-            rgba(0, 0, 0, 1) 80%,
-            /* 保留顶部70%不透明 */ rgba(0, 0, 0, 0) 100% /* 底部30%完全透明 */
-          );
-          -webkit-mask-image: linear-gradient(
-            to bottom,
-            rgba(0, 0, 0, 1) 0%,
-            rgba(0, 0, 0, 1) 80%,
-            rgba(0, 0, 0, 0) 100%
-          );
+          mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 80%, /* 保留顶部70%不透明 */ rgba(0, 0, 0, 0) 100% /* 底部30%完全透明 */);
+          -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 80%, rgba(0, 0, 0, 0) 100%);
 
           &::-webkit-scrollbar {
             width: 0px;
@@ -1024,8 +1007,7 @@
       .lHidding {
         width: 300px;
         height: 100%;
-        background: url('../../../../../assets/img/A6_sangzang_hidContent.png') no-repeat center
-          center;
+        background: url('../../../../../assets/img/A6_sangzang_hidContent.png') no-repeat center center;
         background-size: 100% 100%;
         position: absolute;
         z-index: 1;
@@ -1045,8 +1027,7 @@
           height: 100%;
           display: flex;
           align-items: center;
-          background: url('../../../../../assets/img/A6_sangzang_hidding_left.png') no-repeat center
-            center;
+          background: url('../../../../../assets/img/A6_sangzang_hidding_left.png') no-repeat center center;
           background-size: 100% 100%;
           transition: all 0.6s ease-in-out;
 
@@ -1068,8 +1049,7 @@
               .pic {
                 width: 100%;
                 height: 100%;
-                background: url('../../../../../assets/img/A6_sangzang_mzw0.png') no-repeat center
-                  center;
+                background: url('../../../../../assets/img/A6_sangzang_mzw0.png') no-repeat center center;
                 background-size: contain;
               }
 
@@ -1198,8 +1178,7 @@
             .pic {
               width: 100%;
               height: 100%;
-              background: url('../../../../../assets/img/A6_sangzang_mzw1.png') no-repeat center
-                center;
+              background: url('../../../../../assets/img/A6_sangzang_mzw1.png') no-repeat center center;
               background-size: contain;
             }
 
@@ -1271,8 +1250,7 @@
 
           .openPic {
             opacity: 0;
-            background: url('../../../../../assets/img/A6_sangzang_hidRight.png') no-repeat center
-              center;
+            background: url('../../../../../assets/img/A6_sangzang_hidRight.png') no-repeat center center;
             background-size: 100% 100%;
             height: 100%;
             width: 100%;
@@ -1391,18 +1369,8 @@
               width: 0px;
               height: 0px;
             }
-            mask-image: linear-gradient(
-              to bottom,
-              rgba(0, 0, 0, 1) 0%,
-              rgba(0, 0, 0, 1) 80%,
-              /* 保留顶部70%不透明 */ rgba(0, 0, 0, 0) 100% /* 底部30%完全透明 */
-            );
-            -webkit-mask-image: linear-gradient(
-              to bottom,
-              rgba(0, 0, 0, 1) 0%,
-              rgba(0, 0, 0, 1) 80%,
-              rgba(0, 0, 0, 0) 100%
-            );
+            mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 80%, /* 保留顶部70%不透明 */ rgba(0, 0, 0, 0) 100% /* 底部30%完全透明 */);
+            -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 80%, rgba(0, 0, 0, 0) 100%);
 
             &::-webkit-scrollbar {
               width: 0px;
@@ -1459,8 +1427,7 @@
           right: -2%;
 
           .openPic {
-            background: url('../../../../../assets/img/A6_sangzang_hidLeft.png') no-repeat center
-              center;
+            background: url('../../../../../assets/img/A6_sangzang_hidLeft.png') no-repeat center center;
             background-size: 100% 100%;
             animation: opacityChange 3s infinite ease-in-out;
           }
@@ -1507,8 +1474,7 @@
       .lHidding {
         width: 330px;
         transform: translate(-7%, -50%);
-        background: url('../../../../../assets/img/A6_sangzang_hidContent_r.png') no-repeat center
-          center;
+        background: url('../../../../../assets/img/A6_sangzang_hidContent_r.png') no-repeat center center;
         background-size: 100% 105%;
 
         .lHidding_left {
@@ -1559,8 +1525,7 @@
         .lHidding_right {
           .imgBox {
             .pic {
-              background: url('../../../../../assets/img/A6_sangzang_mzw2.png') no-repeat center
-                center;
+              background: url('../../../../../assets/img/A6_sangzang_mzw2.png') no-repeat center center;
               background-size: 100% 100%;
             }
           }
@@ -1608,8 +1573,7 @@
           width: 300px;
           .imgBox {
             .pic {
-              background: url('../../../../../assets/img/A6_sangzang_mzw3.png') no-repeat center
-                center;
+              background: url('../../../../../assets/img/A6_sangzang_mzw3.png') no-repeat center center;
               background-size: 100% 100%;
             }
           }
@@ -1915,18 +1879,8 @@
               width: 0px;
               height: 0px;
             }
-            mask-image: linear-gradient(
-              to bottom,
-              rgba(0, 0, 0, 1) 0%,
-              rgba(0, 0, 0, 1) 80%,
-              /* 保留顶部70%不透明 */ rgba(0, 0, 0, 0) 100% /* 底部30%完全透明 */
-            );
-            -webkit-mask-image: linear-gradient(
-              to bottom,
-              rgba(0, 0, 0, 1) 0%,
-              rgba(0, 0, 0, 1) 80%,
-              rgba(0, 0, 0, 0) 100%
-            );
+            mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 80%, /* 保留顶部70%不透明 */ rgba(0, 0, 0, 0) 100% /* 底部30%完全透明 */);
+            -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 80%, rgba(0, 0, 0, 0) 100%);
           }
         }
       }
@@ -2007,18 +1961,8 @@
           color: rgba(255, 255, 255, 1);
           overflow: auto;
           font-weight: 400;
-          mask-image: linear-gradient(
-            to bottom,
-            rgba(0, 0, 0, 1) 0%,
-            rgba(0, 0, 0, 1) 80%,
-            /* 保留顶部70%不透明 */ rgba(0, 0, 0, 0) 100% /* 底部30%完全透明 */
-          );
-          -webkit-mask-image: linear-gradient(
-            to bottom,
-            rgba(0, 0, 0, 1) 0%,
-            rgba(0, 0, 0, 1) 80%,
-            rgba(0, 0, 0, 0) 100%
-          );
+          mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 80%, /* 保留顶部70%不透明 */ rgba(0, 0, 0, 0) 100% /* 底部30%完全透明 */);
+          -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 80%, rgba(0, 0, 0, 0) 100%);
 
           &::-webkit-scrollbar {
             width: 0px;

+ 6 - 16
src/pages/A7wjwj/conponents/Discover/index.module.scss

@@ -144,11 +144,11 @@
       }
 
       .point1 {
-        transform: translate(-16%, -83%);
+        transform: translate(-29%, -83%);
       }
 
       .point2 {
-        transform: translate(-5%, 146%);
+        transform: translate(-21%, 151%);
       }
     }
 
@@ -158,11 +158,11 @@
 
       .arrow1 {
         width: 20px;
-        height: 66px;
+        height: 77px;
         position: absolute;
         top: 50%;
         left: 50%;
-        transform: translate(47%, 3%);
+        transform: translate(19%, -2%);
         background: url('../../../../assets/img/A7_discover_arrow1.png') no-repeat center center;
         background-size: contain;
       }
@@ -277,18 +277,8 @@
         padding-bottom: 15px;
         padding-top: 6px;
 
-        mask-image: linear-gradient(
-          to bottom,
-          rgba(0, 0, 0, 1) 0%,
-          rgba(0, 0, 0, 1) 80%,
-          /* 保留顶部70%不透明 */ rgba(0, 0, 0, 0) 100% /* 底部30%完全透明 */
-        );
-        -webkit-mask-image: linear-gradient(
-          to bottom,
-          rgba(0, 0, 0, 1) 0%,
-          rgba(0, 0, 0, 1) 80%,
-          rgba(0, 0, 0, 0) 100%
-        );
+        mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 80%, /* 保留顶部70%不透明 */ rgba(0, 0, 0, 0) 100% /* 底部30%完全透明 */);
+        -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 80%, rgba(0, 0, 0, 0) 100%);
 
         &::-webkit-scrollbar {
           width: 0;

+ 3 - 12
src/pages/A7wjwj/conponents/Shuxing/index.module.scss

@@ -179,6 +179,7 @@
             bottom: 3%;
             right: 2%;
             cursor: pointer;
+            z-index: 1;
           }
         }
       }
@@ -250,18 +251,8 @@
           width: 0px;
           height: 0px;
         }
-        mask-image: linear-gradient(
-          to bottom,
-          rgba(0, 0, 0, 1) 0%,
-          rgba(0, 0, 0, 1) 80%,
-          /* 保留顶部70%不透明 */ rgba(0, 0, 0, 0) 100% /* 底部30%完全透明 */
-        );
-        -webkit-mask-image: linear-gradient(
-          to bottom,
-          rgba(0, 0, 0, 1) 0%,
-          rgba(0, 0, 0, 1) 80%,
-          rgba(0, 0, 0, 0) 100%
-        );
+        mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 80%, /* 保留顶部70%不透明 */ rgba(0, 0, 0, 0) 100% /* 底部30%完全透明 */);
+        -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 80%, rgba(0, 0, 0, 0) 100%);
       }
 
       .imgBox {

+ 4 - 0
src/pages/A7wjwj/conponents/Weijie/index.module.scss

@@ -20,6 +20,10 @@
   }
 }
 
+.weijieAudio {
+  display: none;
+}
+
 .WeijieEn {
   width: 100%;
   height: 0px;

+ 39 - 36
src/pages/A7wjwj/conponents/Weijie/index.tsx

@@ -1,7 +1,5 @@
-import React, { useEffect } from 'react'
+import React from 'react'
 import styles from './index.module.scss'
-import { useSelector } from 'react-redux'
-import { RootState } from '@/store'
 import classNames from 'classnames'
 type Props = {
   txt: string
@@ -10,41 +8,46 @@ type Props = {
 
 function Weijie({ txt, myLang }: Props) {
   // 自动跟着动画速度,内容滚动到div底部
-  useEffect(() => {
-    const weijie = document.getElementById('Weijie')
-    if (weijie) {
-      let interval: number
-      let t1 = setTimeout(() => {
-        if (myLang === 'EN') {
-          const scrollSpeed = 30 // 目标速度:30px/秒
-          const intervalMs = 100 // 每100ms滚动一次
-          const scrollStep = (scrollSpeed * intervalMs) / 1000 // 每次滚动的像素数
+  // useEffect(() => {
+  //   const weijie = document.getElementById('Weijie')
+  //   if (weijie) {
+  //     let interval: number
+  //     let t1 = setTimeout(() => {
+  //       if (myLang === 'EN') {
+  //         const scrollSpeed = 30 // 目标速度:30px/秒
+  //         const intervalMs = 100 // 每100ms滚动一次
+  //         const scrollStep = (scrollSpeed * intervalMs) / 1000 // 每次滚动的像素数
 
-          interval = window.setInterval(() => {
-            const maxScrollTop = weijie.scrollHeight - weijie.clientHeight
-            if (weijie.scrollTop < maxScrollTop) {
-              const nextScrollTop = Math.min(weijie.scrollTop + scrollStep, maxScrollTop)
-              weijie.scrollTop = nextScrollTop
-              if (nextScrollTop === maxScrollTop) {
-                clearInterval(interval)
-              }
-            } else {
-              clearInterval(interval)
-            }
-          }, intervalMs)
-        }
-      }, 3000)
+  //         interval = window.setInterval(() => {
+  //           const maxScrollTop = weijie.scrollHeight - weijie.clientHeight
+  //           if (weijie.scrollTop < maxScrollTop) {
+  //             const nextScrollTop = Math.min(weijie.scrollTop + scrollStep, maxScrollTop)
+  //             weijie.scrollTop = nextScrollTop
+  //             if (nextScrollTop === maxScrollTop) {
+  //               clearInterval(interval)
+  //             }
+  //           } else {
+  //             clearInterval(interval)
+  //           }
+  //         }, intervalMs)
+  //       }
+  //     }, 3000)
 
-      // 清理函数:清除定时器
-      return () => {
-        clearTimeout(t1)
-        if (interval) {
-          clearInterval(interval)
-        }
-      }
-    }
-  }, [myLang, txt])
-  return <div id='Weijie' className={classNames(styles.Weijie, myLang === 'EN' ? styles.WeijieEn : '')} dangerouslySetInnerHTML={{ __html: txt }}></div>
+  //     // 清理函数:清除定时器
+  //     return () => {
+  //       clearTimeout(t1)
+  //       if (interval) {
+  //         clearInterval(interval)
+  //       }
+  //     }
+  //   }
+  // }, [myLang, txt])
+  return (
+    <>
+      <audio className={styles.weijieAudio} loop autoPlay src='myData/weijie.mp3' />
+      <div id='Weijie' className={classNames(styles.Weijie, myLang === 'EN' ? styles.WeijieEn : '')} dangerouslySetInnerHTML={{ __html: txt }}></div>
+    </>
+  )
 }
 
 const MemoWeijie = React.memo(Weijie)