调式

app/index/view/pc/topic_laptop/index.html

@@ -30,14 +30,13 @@
 <script type="text/javascript">
     (function (doc, win)
     {
-
         var docEl = doc.documentElement;
         var resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize';
         var designWidth = 2560;
         var designRemPx = 100;
         function setRootFontSize ()
         {
-            console.log('触发')
+
             var clientWidth = docEl.clientWidth;
             if (!clientWidth) return;
             var fontSize = (clientWidth / designWidth) * designRemPx;
@@ -55,15 +54,6 @@
 {block name="main"}
 {notempty name="data.top_focus_images"}
 <div class="swiper-container auto-swiper-container" style="margin-top:60px;">
-        {eq name=":cookie('think_lang')" value="en-us"}
-            <div class="swiper-wrapper">
-                {volist name="data.top_focus_images" id="tfi"}
-                <a class="swiper-slide auto-swiper-slide" href="{$tfi.link}">
-                    <img src="{$tfi.image}" alt="{$tfi.title}" />
-                </a>
-                {/volist}
-            </div>
-        {else/}
     <div class="swiper-wrapper">
         {volist name="data.top_focus_images" id="tfi"}
         <div class="swiper-slide auto-swiper-slide">
@@ -72,15 +62,18 @@
                 <div  class="swiper-container-texts-p">{$tfi.desc||raw|htmlspecialchars_decode}</div>
                 <div class="swiper-container-texts-img">
                     <a  href="{$tfi.link}">
-                            <img src="__IMAGES__/topic_laptop/ljgd.png" alt="" loading="lazy" >
+                        {eq name=":cookie('think_lang')" value="en-us"}
+                        <img src="__IMAGES__/topic_laptop/eljgd.png" alt=""  >
+                        {else/}
+                        <img src="__IMAGES__/topic_laptop/ljgd.png" alt=""  >
+                        {/eq}
                     </a>
                 </div>
             </div>
-                <img src="{$tfi.image}" alt="{$tfi.title}" loading="lazy" />
+            <img src="{$tfi.image}" alt="{$tfi.title}"  />
         </div>
         {/volist}
     </div>
-        {/eq}
 </div>
 {/notempty}
 {notempty name="data.perf"}
@@ -214,7 +207,6 @@
             <img src="{$gpu_first_section.extra_image|default=''}" alt="" loading="lazy" >
         </div>
         {/eq}
-
     </div>
     <div class="readon-img-box opacity0" data-order="11">
         {volist name="data.gpu" id="go"}
@@ -275,7 +267,6 @@
 </div>
 {notempty name="data.ram"}
 <div class="wift" >
-
     <div class="wift-bg" style="background: url('{$data.ram.image}');background-size:100% auto;">
         <div class="wift-test">
             <div class="wift-t opacity0" data-order="12">{$data.ram.title|raw}</div>
@@ -290,7 +281,6 @@
         <div class="wift-bg-img opacity0" data-order="14">
             {$data.ram.desc|raw}
         </div>
-
     </div>
 </div>
 {/notempty}
@@ -311,7 +301,6 @@
     </div>
 </div>
 {/notempty}
-
 <div class="fs">
     {notempty name="data.cooling_system"}
     {notempty name="$data.cooling_system.0"}
@@ -332,13 +321,13 @@
         </video>
         <div class="fs-ts">{$data.cooling_system.0.desc|raw}</div>
         {/notempty}
-        <div class="fs-box-img opacity0" data-order="18">
+        <div class="fs-box-img" >
             <div class="fs-h-img">
-                {notempty name="data.cooling_system.1"}<img src="{$data.cooling_system.1.image}" alt="" loading="lazy" >{/notempty}
+                {notempty name="data.cooling_system.1"}<img src="{$data.cooling_system.1.image}" alt=""  >{/notempty}
-                {notempty name="data.cooling_system.2"}<img src="{$data.cooling_system.2.image}" alt="" loading="lazy" >{/notempty}
+                {notempty name="data.cooling_system.2"}<img src="{$data.cooling_system.2.image}" alt=""  >{/notempty}
             </div>
             <div class="fs-b-img"  style="min-height: 20px;">
-                {notempty name="data.cooling_system.3"}<img src="{$data.cooling_system.3.image}" alt="" loading="lazy" >{/notempty}
+                {notempty name="data.cooling_system.3"}<img src="{$data.cooling_system.3.image}" alt=""  >{/notempty}
             </div>
         </div>
     </div>
@@ -346,10 +335,10 @@
 {/notempty}
 {notempty name="data.apps"}
 <div class="xn">
-    <div class="xn-t opacity0" data-order="19">{$data.apps.title|default=''}</div>
+    <div class="xn-t" >{$data.apps.title|default=''}</div>
     <div class="xn-container">
         <div class="xn-image-section">
-            <img src="{$data.apps.image|default=''}" alt="" class="zoom-image first-image" loading="lazy">
+            <img src="{$data.apps.image|default=''}" alt="" class="zoom-image first-image" >
         </div>
     </div>
     <div class="xn-p">{$data.apps.desc|default=''|raw}</div>
@@ -363,8 +352,6 @@
         <div class="ips-t">{$soft_light_first.title|raw}</div>
         <div class="ips-p">{$soft_light_first.short_title|raw}</div>
         {/notempty}
-
-
         {eq name=":cookie('think_lang')" value="en-us"}
         <div class="ips-img1 opacity0" data-order="21">
             {volist name="data.screen_soft_light" id="so"}
@@ -378,8 +365,6 @@
             {/volist}
         </div>
         {/eq}
-
-
     </div>
 </div>
 {/notempty}
@@ -1260,7 +1245,6 @@
     const tabT = document.querySelectorAll('.tab-t');
     const indicator = document.querySelector('.tab-indicator');
     const securityVideo = document.getElementById('securityVideo');
-    console.log(tabT,'=========tabT=============')
     let prevIndex = 0;
     const tabRects = [];
 
@@ -1355,110 +1339,7 @@
         resetVideo();
     });
 
-
+    document.addEventListener('DOMContentLoaded', () => {
-// document.addEventListener('DOMContentLoaded', () => {
-//     // 1. 获取元素（匹配你的结构）
-//     const carouselImgs = document.querySelector('.carousel-imgs');
-//     const imgItems = document.querySelectorAll('.carousel-img');
-//     const leftArrow = document.querySelector('.arrow-left');
-//     const rightArrow = document.querySelector('.arrow-right');
-//     const textItems = document.querySelectorAll('.carousel-text');
-//     const carouselContainer = document.querySelector('.carousel-container');
-
-//     // 容错处理
-//     if (!carouselImgs || imgItems.length === 0) {
-//         console.warn('轮播图片为空，初始化终止');
-//         return;
-//     }
-
-//     // 2. 核心变量（仅索引，无尺寸计算）
-//     const imgCount = imgItems.length;
-//     let currentIndex = 0;
-//     let autoPlayTimer = null;
-//     let isResizing = false; // 缩放锁，避免重复触发
-
-//     // 3. 切换到指定索引（核心：百分比偏移，无尺寸计算）
-//     const goToIndex = (index) => {
-//         // 边界处理
-//         if (index < 0) index = imgCount - 1;
-//         if (index >= imgCount) index = 0;
-
-//         // 关键：用百分比偏移，彻底避开rem/px计算误差
-//         carouselImgs.style.transform = `translateX(-${index * 100}%)`;
-//         currentIndex = index;
-
-//         // 更新文字激活态
-//         textItems.forEach((item, idx) => {
-//             item.classList.toggle('active', idx === currentIndex);
-//         });
-//     };
-
-//     // 4. 左右切换逻辑
-//     const slideNext = () => goToIndex(currentIndex + 1);
-//     const slidePrev = () => goToIndex(currentIndex - 1);
-
-//     // 5. 自动播放逻辑
-//     const autoPlay = () => {
-//         clearInterval(autoPlayTimer);
-//         autoPlayTimer = setInterval(slideNext, 3000); // 3秒切换，可改
-//     };
-
-//     // 6. 绑定事件
-//     // 箭头点击
-//     leftArrow?.addEventListener('click', () => {
-//         slidePrev();
-//         autoPlay(); // 点击后重启自动播放
-//     });
-//     rightArrow?.addEventListener('click', () => {
-//         slideNext();
-//         autoPlay();
-//     });
-
-//     // 文字指示器点击
-//     textItems.forEach((item, idx) => {
-//         item.addEventListener('click', () => {
-//             goToIndex(idx);
-//             autoPlay();
-//         });
-//     });
-
-//     // 鼠标悬停暂停
-//     carouselContainer?.addEventListener('mouseenter', () => {
-//         clearInterval(autoPlayTimer);
-//     });
-//     carouselContainer?.addEventListener('mouseleave', autoPlay);
-
-//     // 7. 窗口缩放响应（核心：仅重新定位，无计算）
-//     const handleResize = () => {
-//         if (isResizing) return;
-//         isResizing = true;
-
-//         // 缩放时直接重新定位当前索引（百分比偏移无需计算）
-//         goToIndex(currentIndex);
-
-//         // 解锁
-//         setTimeout(() => {
-//             isResizing = false;
-//         }, 100);
-//     };
-
-//     // 防抖监听窗口缩放
-//     let resizeTimer;
-//     window.addEventListener('resize', () => {
-//         clearTimeout(resizeTimer);
-//         resizeTimer = setTimeout(handleResize, 150);
-//     });
-
-//     // 8. 初始化
-//     goToIndex(0); // 初始定位到第一张
-//     autoPlay();   // 启动自动播放
-
-//     // 9. 页面卸载清理定时器
-//     window.addEventListener('beforeunload', () => {
-//         clearInterval(autoPlayTimer);
-//     });
-// });
-document.addEventListener('DOMContentLoaded', () => {
         // 1. 获取元素
         const carouselImgs = document.querySelector('.carousel-imgs');
         const imgItems = document.querySelectorAll('.carousel-img');
@@ -1614,6 +1495,6 @@ document.addEventListener('DOMContentLoaded', () => {
         window.addEventListener('beforeunload', () => {
             clearInterval(autoPlayTimer);
         });
-});
+    });
 </script>
 {/block}

public/static/index/pc/css/topic_laptop/index.css

@@ -43,8 +43,3 @@ body {
     /* [data-order="19"] {
         transition: all 0.3s ease-out 0.2s !important;
     } */
-[data-order], .annotation, .progress-fill, .zoom-image, .float-card {
-    transform: translateZ(0); /* 开启硬件加速，将元素交给 GPU 渲染 */
-    will-change: opacity, transform; /* 告诉浏览器提前优化这个元素 */
-    backface-visibility: hidden; /* 防止元素翻转时的闪烁 */
-}

public/static/index/pc/css/topic_laptop/progress.css

@@ -189,14 +189,14 @@
 .progress-p {
 	color: #cbcfd8;
 	font-size: clamp(16px, 1vw, 0.22rem);
-	margin-top: 1.23rem;
+	margin-top: 1.56rem;
-    margin-bottom: 5.04rem;
+    margin-bottom: 2rem;
 	text-align: center;
 }
 .progress-p1 {
     color: #cbcfd8;
 	font-size: clamp(16px, 1vw, 0.22rem);
 	margin-top: 1.56rem;
-    /* margin-bottom: 2.3rem; */
+    /* margin-bottom: 1.66rem; */
 	text-align: center;
 }

public/static/index/pc/css/topic_laptop/wift.css

@@ -39,7 +39,7 @@
 	color: #cbcfd8;
 	width: 100%;
 	text-align: center;
-	padding-top: 0.39rem;
+	padding-top: 0.43rem;
     line-height: 1.8;
     font-family: "HarmonyOS-Light";
 }