update：修改

index.html

@@ -3,9 +3,9 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <meta name="description" content="跃动——让世界爱上跳绳" />
+    <meta name="description" content="跃动——跃出健康，享受运动" />
     <link rel="icon" href="/app.ico" />
-    <title>跃动｜让世界爱上跳绳</title>
+    <title>跃动｜跃出健康 享受运动</title>
   </head>
   <body>
     <div id="app"></div>

ossutil_output/ossutil_report_20260727_180557_48708.report

@@ -0,0 +1 @@
+# C:\Project\官网\YD-WEB\.tools\ossutil-2.3.0-windows-amd64\ossutil.exe -c C:\Users\19304\.ossutilconfig cp C:\Project\官网\YD-WEB\dist\ oss://yuedong-wechatapplet/static/wwwweb/20260727-180545/ -r --exclude index.html -f -q --no-progress

src/components/SiteFooter.vue

@@ -3,7 +3,7 @@
     <div class="footer-orbit footer-orbit-one"></div>
     <div class="footer-orbit footer-orbit-two"></div>
     <div class="footer-inner">
-      <div class="footer-brand"><img :src="logoUrl" alt="跃动 YUEDONG" /><p>让世界爱上跳绳</p><small>MAKE THE WORLD LOVE ROPE SKIPPING</small></div>
+      <div class="footer-brand"><img :src="logoUrl" alt="跃动 YUEDONG" /><p>跃出健康，享受运动</p><small>MAKE THE WORLD LOVE ROPE SKIPPING</small></div>
       <div><b>探索跃动</b><RouterLink to="/about/brand-story">关于跃动</RouterLink><RouterLink to="/sports/competition">跃动体育</RouterLink></div>
       <div><b>业务版图</b><RouterLink to="/technology">跃动科技</RouterLink><RouterLink to="/health">跃动健康</RouterLink><RouterLink to="/factory/supply-chain">跃动工厂</RouterLink></div>
       <div><b>连接我们</b><RouterLink to="/ygjrc">YGJRC</RouterLink><RouterLink to="/contact">联系我们</RouterLink></div>

src/components/SiteHeader.vue

@@ -11,7 +11,6 @@
               <div class="dropdown-groups">
                 <section v-for="group in item.groups" :key="group.label" class="dropdown-group">
                   <RouterLink class="dropdown-group-title" :to="group.to" @click="closeMenu">{{ group.label }}</RouterLink>
-                  <RouterLink v-for="child in group.children" :key="child.label" :to="child.to" @click="closeMenu">{{ child.label }}</RouterLink>
                 </section>
               </div>
             </template>

src/style.css

@@ -63,13 +63,12 @@ main { min-height: 72vh; }
 .dropdown a::before { content: ""; position: absolute; left: 10px; top: 50%; width: 5px; height: 5px; border-radius: 50%; background: var(--blue-300); transform: translateY(-50%); transition: .22s; }
 .dropdown a:hover, .dropdown a.router-link-active { color: var(--blue-700); background: var(--blue-50); transform: translateX(3px); }
 .dropdown a:hover::before { background: var(--blue-600); box-shadow: 0 0 0 4px rgba(0,144,255,.12); }
-.dropdown-mega { width: min(820px,calc(100vw - 48px)); padding: 18px; }
+.dropdown-mega { width: min(620px,calc(100vw - 48px)); padding: 18px; }
-.dropdown-groups { display: grid; grid-template-columns: .85fr 1fr 1.45fr; gap: 12px; }
+.dropdown-groups { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
 .dropdown-group { min-width: 0; padding: 6px; border-radius: 11px; background: #f8fbff; }
-.dropdown .dropdown-group-title { margin: 0 0 5px; padding: 11px 12px; color: var(--blue-800); background: #eaf6ff; font-size: 14px; font-weight: 800; }
+.dropdown .dropdown-group-title { margin: 0; padding: 13px 14px; color: var(--blue-800); background: #eaf6ff; font-size: 14px; font-weight: 800; }
 .dropdown .dropdown-group-title::before { display: none; }
-.dropdown .dropdown-group-title:hover { transform: none; }
+.dropdown .dropdown-group-title:hover { transform: translateY(-2px); }
-.dropdown-group a:not(.dropdown-group-title) { padding-top: 8px; padding-bottom: 8px; font-size: 13px; }
 .nav-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; }
 .language-switch { height: 38px; display: inline-grid; grid-template-columns: repeat(2,34px); align-items: center; padding: 3px; border: 1px solid rgba(0,144,255,.2); border-radius: 20px; background: var(--blue-50); box-shadow: inset 0 0 0 1px rgba(255,255,255,.7); }
 .language-switch span,.language-switch a { height: 30px; display: grid; place-items: center; border-radius: 16px; font-size: 11px; font-weight: 800; letter-spacing: .4px; transition: color .25s ease, background .25s ease, transform .25s ease, box-shadow .25s ease; }
@@ -89,8 +88,9 @@ main { min-height: 72vh; }
 /* Vue-native homepage */
 .new-home { overflow: hidden; background: #fff; padding-top: 78px;}
 .home-hero { position: relative; min-height: 800px;  isolation: isolate; overflow: hidden; color: #fff; background: #0090ff; }
-.home-hero-media { position: absolute; inset: 0; z-index: -4; width: 100%; background: url('/site/assets/images/banners/banner.png') 68% center/cover no-repeat; transform: scale(1.015); transform-origin: right center; animation: heroBreath 14s ease-in-out infinite alternate; }
+.home-hero-media { position: absolute; inset: 0; z-index: -4; width: 100%; overflow: hidden; background: #006fc9; }
-@keyframes heroBreath { to { transform: scale(1.09); } }
+.home-hero-slide { position: absolute; inset: 0; opacity: 0; background-position: center; background-size: cover; transform: translateX(20%) scale(1.055); transition: opacity 1.1s ease, transform 7s ease; }
+.home-hero-slide.active { opacity: 1; transform: translateX(25%) scale(1.105); }
 .home-hero-shade { position: absolute; inset: 0; z-index: -3; width: 100%; background: linear-gradient(90deg,transparent 45%,rgba(0,43,82,.04) 70%,rgba(0,20,42,.18) 100%); }
 .home-hero-solid { position: absolute; inset: 0; z-index: -2; width: 100%; background: linear-gradient(90deg,#006fc9 0%,#0086ec 30%,#0090ff 45%,rgba(0,144,255,.98) 50%,rgba(0,144,255,.86) 55%,rgba(0,144,255,.56) 61%,rgba(0,144,255,.22) 68%,rgba(0,144,255,0) 76%); }
 .home-hero-grid { display: none; }
@@ -107,9 +107,9 @@ main { min-height: 72vh; }
 .home-primary-button,.home-ghost-button { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 24px; border-radius: 11px; font-size: 13px; font-weight: 700; transition: .3s; }
 .home-primary-button { gap: 30px; color: #fff; background: var(--blue-600); box-shadow: 0 16px 35px rgba(0,144,255,.3); }.home-primary-button span { transition: transform .25s; }.home-primary-button:hover { transform: translateY(-4px); box-shadow: 0 22px 42px rgba(0,144,255,.4); }.home-primary-button:hover span { transform: translateX(6px); }
 .home-ghost-button { color: #fff; border: 1px solid rgba(255,255,255,.35); background: rgba(255,255,255,.06); backdrop-filter: blur(10px); }.home-ghost-button:hover { border-color: var(--blue-300); background: rgba(0,144,255,.16); }
-.home-stats { position: absolute; left: 50%; transform: translateX(-50%); bottom: 36px; display: grid; grid-template-columns: repeat(4,auto); gap: 0; }
+.home-hero-dots { position: absolute; left: 50%; bottom: 38px; z-index: 3; display: flex; align-items: center; gap: 9px; transform: translateX(-50%); }
-.home-stats > div { min-width: 150px; padding: 0 30px; border-left: 1px solid rgba(255,255,255,.2); }.home-stats > div:first-child { padding-left: 0; border-left: 0; }
+.home-hero-dots button { width: 30px; height: 4px; padding: 0; border: 0; border-radius: 4px; background: rgba(255,255,255,.4); cursor: pointer; transition: width .3s ease, background .3s ease; }
-.home-stats strong,.home-stats span { display: block; }.home-stats strong { font-size: 22px; }.home-stats span { margin-top: 6px; color: rgba(235,247,255,.5); font-size: 10px; letter-spacing: 1px; }
+.home-hero-dots button.active { width: 54px; background: #fff; }
 .home-scroll { position: absolute; right: 34px; bottom: 36px; display: flex; align-items: center; gap: 13px; color: rgba(255,255,255,.48); font-size: 8px; letter-spacing: 2px; writing-mode: vertical-rl; }.home-scroll i { position: relative; display: block; width: 1px; height: 55px; overflow: hidden; background: rgba(255,255,255,.2); }.home-scroll i::after { content: ""; position: absolute; inset: -100% 0 auto; height: 100%; background: #fff; animation: scrollLine 2s ease-in-out infinite; }
 .home-about { display: grid; grid-template-columns: minmax(360px,.9fr) minmax(0,1.1fr); gap: 95px; align-items: center; padding-top: 120px; padding-bottom: 130px; }
 .home-honor-carousel { position: relative; min-height: 540px; overflow: hidden; border: 1px solid rgba(0,144,255,.14); border-radius: 30px 6px 30px 6px; background: linear-gradient(145deg,#fff,var(--blue-50)); box-shadow: var(--shadow); isolation: isolate; }
@@ -156,7 +156,7 @@ main { min-height: 72vh; }
 @keyframes homeReveal { from { opacity: .25; transform: translateY(26px); } to { opacity: 1; transform: translateY(0); } }
 
 /* Yuedong Jumping Home */
-.sports-hall-page { display: grid; gap: 92px; }
+.sports-hall-page { display: grid; width: 100%; min-width: 0; gap: 92px; }
 .hall-kicker { color: var(--blue-600); font-size: 10px; font-weight: 900; letter-spacing: 3px; }
 .sports-hall-page h3 { color: var(--ink); font-size: clamp(32px,4vw,52px); line-height: 1.18; letter-spacing: -2px; }
 .hall-intro { position: relative; display: grid; grid-template-columns: minmax(0,1.05fr) minmax(380px,.95fr); min-height: 590px; overflow: hidden; border-radius: 32px 7px 32px 7px; background: linear-gradient(125deg,#006fc9 0%,#0090ff 66%,#39b3ff 100%); box-shadow: 0 28px 70px rgba(0,92,175,.2); }
@@ -201,7 +201,7 @@ main { min-height: 72vh; }
 .hall-values-grid article small { font-size: 11px; font-weight: 900; text-transform: uppercase; letter-spacing: 1px; }
 .hall-values-grid h4 { margin: 24px 0 12px; color: var(--value-color); font-size: 17px; }
 .hall-values-grid p { position: relative; z-index: 1; margin: 0; color: var(--muted); font-size: 13px; line-height: 1.75; }
-.hall-curriculum { margin-right: calc((100vw - 100%)/-2); margin-left: calc((100vw - 100%)/-2); padding: 90px max(5vw,calc((100vw - 1200px)/2)); color: #fff; background: linear-gradient(135deg,#006fc9,#0090ff 62%,#42b5ff); }
+.hall-curriculum { width: 100%; min-width: 0; margin: 0; overflow: hidden; padding: 82px clamp(24px,5vw,64px); color: #fff; border-radius: 28px 6px 28px 6px; background: linear-gradient(135deg,#006fc9,#0090ff 62%,#42b5ff); }
 .hall-section-title.light h3 { color: #fff; }
 .hall-section-title.light .hall-kicker { color: #b9e4ff; }
 .hall-section-title.light p { color: rgba(255,255,255,.72); }
@@ -708,7 +708,7 @@ main { min-height: 72vh; }
 .footer-inner > div:nth-child(4) { transition-delay: .26s; }
 .footer-brand img { width: 180px; max-height: 70px; object-fit: contain; object-position: left center; }
 .footer-brand p { margin: 20px 0 8px; color: #d8eeff; font-size: 20px; font-weight: 700; }
-.footer-brand small { color: rgba(216,238,255,.42); font-size: 8px; letter-spacing: 2px; }
+.footer-brand small { color: rgba(216,238,255,1); font-size: 8px; letter-spacing: 2px; }
 .footer-inner b { display: block; margin-bottom: 22px; color: #fff; font-size: 14px; }
 .footer-inner a { position: relative; display: block; width: max-content; margin-bottom: 14px; color: rgba(216,238,255,.58); font-size: 13px; transition: .25s; }
 .footer-inner a::before { content: ""; position: absolute; left: -15px; top: 50%; width: 0; height: 1px; background: var(--blue-300); transition: .25s; }
@@ -759,9 +759,9 @@ main { min-height: 72vh; }
   .dropdown a { display: inline-block; margin-right: 18px; padding: 9px 0; font-size: 14px; }
   .dropdown a::before { display: none; }
   .dropdown-mega { width: 100%; padding-left: 18px; }
+  .dropdown .dropdown-group-title { display: block; margin: 0; padding: 10px 0; background: transparent; }
   .dropdown-groups { display: block; }
   .dropdown-group { margin: 5px 0 10px; padding: 8px 10px; }
-  .dropdown .dropdown-group-title { display: block; margin: 0; padding: 9px 0; background: transparent; }
   .home-original { padding-top: 70px; }
   .page-hero { height: 400px; padding-top: 70px; }
   .scroll-cue { display: none; }
@@ -775,15 +775,13 @@ main { min-height: 72vh; }
   .footer-inner { grid-template-columns: 1.6fr 1fr 1fr; }
   .footer-inner > div:last-child { grid-column: 2; }
   .home-hero { min-height: 760px; padding-top: 70px; }
-  .home-hero-media { width: 100%; background-position: 68% center; }
+  .home-hero-media { width: 100%; }
   .home-hero-shade { width: 100%; }
   .home-hero-solid { width: 100%; background: linear-gradient(90deg,#006fc9 0%,#0090ff 56%,rgba(0,144,255,.96) 62%,rgba(0,144,255,.68) 70%,rgba(0,144,255,.28) 80%,rgba(0,144,255,0) 90%); }
   .home-hero-grid { display: none; }
   .home-hero-content { min-height: 690px; }
   .home-hero h1 { font-size: 78px; }
   .home-hero-content > p { max-width: 600px; }
-  .home-stats { grid-template-columns: repeat(2,1fr); gap: 18px 0; bottom: 28px; }
-  .home-stats > div:nth-child(3) { padding-left: 0; border-left: 0; }
   .home-scroll { display: none; }
   .home-about { grid-template-columns: 1fr; gap: 70px; }
   .home-about-image { width: min(650px,92%); }
@@ -848,17 +846,15 @@ main { min-height: 72vh; }
   .copyright { width: calc(100% - 36px); display: block; line-height: 2; }
   .copyright span { display: block; }
   .home-hero { min-height: 760px; }
-  .home-hero-media,.home-hero-shade,.home-hero-grid { display: none; }
+  .home-hero-shade,.home-hero-grid { display: none; }
   .home-hero-shade { background: linear-gradient(90deg,rgba(0,99,183,.92),rgba(0,144,255,.7)),linear-gradient(0deg,rgba(0,111,201,.68),transparent 60%); }
-  .home-hero-solid { width: 100%; clip-path: none; background: linear-gradient(145deg,#006fc9 0%,#0090ff 78%,#35a9ff 100%); }
+  .home-hero-solid { width: 100%; clip-path: none; background: linear-gradient(180deg,rgba(0,75,142,.66),rgba(0,119,215,.38) 55%,rgba(0,45,88,.68)); }
   .home-hero-grid { background-size: 44px 44px; }
   .home-hero-content { min-height: 690px; justify-content: flex-start; padding-top: 105px; }
   .home-hero h1 { margin-top: 18px; font-size: 58px; line-height: 1; letter-spacing: -4px; }
   .home-hero-content > p { max-width: 100%; font-size: 17px; line-height: 1.7; text-align: center; }
   .home-hero-actions { width: 100%; align-items: stretch; flex-direction: column; }
   .home-primary-button,.home-ghost-button { width: 100%; }
-  .home-stats { left: 15px; right: 15px; grid-template-columns: repeat(2,1fr); }
-  .home-stats > div { min-width: 0; padding: 0 12px; }.home-stats > div:nth-child(odd) { padding-left: 0; border-left: 0; }
   .ring-one { width: 330px; height: 330px; right: -190px; top: 160px; }.ring-two { display: none; }
   .home-about { padding-top: 80px; padding-bottom: 90px; }
   .home-about-image { width: calc(100% - 14px); }.home-about-image img { min-height: 370px; }.home-about-image > span { right: -14px; bottom: 34px; }

src/views/HomePage.vue

@@ -1,22 +1,38 @@
 <template>
   <div class="new-home">
-    <section class="home-hero">
+    <section class="home-hero" @mouseenter="stopBannerRotation" @mouseleave="startBannerRotation">
-      <div class="home-hero-media"></div>
+      <div class="home-hero-media" aria-hidden="true">
+        <div
+          v-for="(banner, index) in heroBanners"
+          :key="banner"
+          class="home-hero-slide"
+          :class="{ active: index === activeBanner }"
+          :style="{ backgroundImage: `url('${banner}')` }"
+        ></div>
+      </div>
       <!-- <div class="home-hero-shade"></div> -->
       <div class="home-hero-solid"></div>
       <div class="home-hero-grid"></div>
       <!-- <div class="home-hero-ring ring-one"></div><div class="home-hero-ring ring-two"></div> -->
       <div class="container home-hero-content">
         <div class="home-eyebrow">YUEDONG · SINCE 2009</div>
-        <h1>让世界<br /><em>爱上跳绳</em></h1>
+        <h1>跃出健康<br /><em style="padding-left: 20px;">享受运动</em></h1>
-        <p>以跳绳为核心，连接专业装备、国际赛事、教育培训、智慧科技与运动健康，让每一次跃起都更有力量。</p>
+        <!-- <p>以跳绳为核心，连接专业装备、国际赛事、教育培训、智慧科技与运动健康，让每一次跃起都更有力量。</p> -->
         <div class="home-hero-actions">
           <RouterLink class="home-primary-button" to="/about/brand-story">探索跃动 <span>→</span></RouterLink>
           <RouterLink class="home-ghost-button" to="/sports/equipment">查看跃动装备</RouterLink>
         </div>
-        <div class="home-stats">
+      </div>
-          <div><strong>2009</strong><span>品牌创立</span></div><div><strong>30+</strong><span>全国运动馆</span></div><div><strong>100+</strong><span>专业教练</span></div><div><strong>GLOBAL</strong><span>全球业务网络</span></div>
+      <div class="home-hero-dots" aria-label="首页背景轮播">
-        </div>
+        <button
+          v-for="(banner, index) in heroBanners"
+          :key="`${banner}-dot`"
+          type="button"
+          :class="{ active: index === activeBanner }"
+          :aria-label="`查看第 ${index + 1} 张首页背景图`"
+          :aria-current="index === activeBanner ? 'true' : undefined"
+          @click="selectBanner(index)"
+        ></button>
       </div>
       <div class="home-scroll"><i></i><span>SCROLL TO EXPLORE</span></div>
     </section>
@@ -92,8 +108,26 @@ import products from '../data/product-details.json';
 import { pages } from '../data/page-content.js';
 
 const featuredProducts = [products[0], products[32], products[58], products[70]].filter((item) => item?.images?.[0]);
+const heroBanners = ['/site/assets/images/banners/1.jpg', '/site/assets/images/banners/2.jpg'];
+const activeBanner = ref(0);
+let bannerTimer;
+const stopBannerRotation = () => {
+  if (bannerTimer) window.clearInterval(bannerTimer);
+  bannerTimer = undefined;
+};
+const startBannerRotation = () => {
+  stopBannerRotation();
+  if (window.matchMedia('(prefers-reduced-motion: reduce)').matches) return;
+  bannerTimer = window.setInterval(() => {
+    activeBanner.value = (activeBanner.value + 1) % heroBanners.length;
+  }, 5500);
+};
+const selectBanner = (index) => {
+  activeBanner.value = index;
+  startBannerRotation();
+};
 const honors = [
-  { year: '2019', title: '国家体育产业示范项目', image: '/site/assets/images/about/about.webp' },
+  { year: '2019', title: '国家体育产业示范项目', image: '/site/assets/images/about/about.jpg' },
   { year: '2025', title: '《跳绳》国家标准起草单位', image: '/materials/关于跃动/009-跳绳国家标准-第一起草单位.webp' },
   { year: '2023', title: '国际跳绳联合会合作伙伴', image: '/materials/关于跃动/008-世界跳绳锦标赛官方合作伙伴.webp' }
 ];
@@ -108,8 +142,14 @@ const startHonorRotation = () => {
 const selectHonor = (index) => { activeHonor.value = index; startHonorRotation(); };
 const previousHonor = () => { activeHonor.value = (activeHonor.value - 1 + honors.length) % honors.length; startHonorRotation(); };
 const nextHonor = () => { activeHonor.value = (activeHonor.value + 1) % honors.length; startHonorRotation(); };
-onMounted(startHonorRotation);
+onMounted(() => {
-onBeforeUnmount(stopHonorRotation);
+  startBannerRotation();
+  startHonorRotation();
+});
+onBeforeUnmount(() => {
+  stopBannerRotation();
+  stopHonorRotation();
+});
 const eventArticles = pages.sports.sections['event-news'].articles.slice(0, 3).map((article, index) => ({ ...article, image: pages.sports.sections['event-news'].gallery[index]?.src || pages.sports.hero?.src, to: `/detail/sports/event-news/${index}` }));
 
 const vReveal = {