diff --git a/src/views/commonpage.vue b/src/views/commonpage.vue
index d883900..d62b8f3 100644
--- a/src/views/commonpage.vue
+++ b/src/views/commonpage.vue
@@ -70,7 +70,7 @@
     </div>
 
     <div style="height: 145px; background: #000"
-         class="row justify-center color-white">
+         class="row justify-center color-white relative">
       <div class="col-6 col-md-4 row justify-around"
            style="margin-top: 32px; max-width: 300px">
         <div class="cursor"
@@ -83,6 +83,102 @@
           copyright 2024 最终所有权归延庆博物馆
         </div>
       </div>
+      <div v-if="state.isH5 == 'true'"
+           style="
+          border-radius: 50%;
+          position: absolute;
+          top: -60px;
+          left: 60px;
+          z-index: 10;
+        "
+           class="relative menu-dom">
+        <img src="../assets/images/icon-menu.png"
+             style="width: 32px" />
+
+        <div class="menu-hover-dom row justify-center"
+             style="
+            position: absolute;
+            top: -345px;
+            left: 18px;
+            z-index: 9;
+            padding-bottom: 20px;
+          ">
+          <div class="row justify-center fl-mt-lg"
+               style="
+              padding: 0 10px;
+              height: 340px;
+              width: 104px;
+              background: #000;
+            ">
+            <div class="cursor col-12 row items-center justify-center"
+                 style="border-bottom: 1px solid #fff"
+                 @click="handleLink('/home/navigation')">
+              首页
+            </div>
+            <div class="cursor col-12 row items-center justify-center"
+                 style="border-bottom: 1px solid #fff"
+                 @click="handleLink('')">
+              导航
+            </div>
+            <div class="cursor col-12 row items-center justify-center"
+                 style="border-bottom: 1px solid #fff"
+                 @click="handleLink('')">
+              展览
+            </div>
+            <div class="cursor col-12 row items-center justify-center"
+                 style="border-bottom: 1px solid #fff"
+                 @click="handleLink('')">
+              典藏
+            </div>
+            <div class="cursor col-12 row items-center justify-center"
+                 style="border-bottom: 1px solid #fff"
+                 @click="handleLink('')">
+              资讯
+            </div>
+            <div class="cursor col-12 row items-center justify-center"
+                 style="border-bottom: 1px solid #fff"
+                 @click="handleLink('')">
+              文创
+            </div>
+            <div class="cursor col-12 row items-center justify-center"
+                 style="border-bottom: 1px solid #fff"
+                 @click="handleLink('')">
+              数字文脉
+            </div>
+            <div class="cursor col-12 row items-center justify-center relative about-dom">
+              关于
+              <div class="about-hover-dom row justify-center"
+                   style="
+                  position: absolute;
+                  top: -122px;
+                  left: 120%;
+                  z-index: 9;
+                  padding-bottom: 20px;
+                ">
+                <div class="row justify-center fl-mt-lg"
+                     style="padding: 0 10px; width: 104px; background: #000">
+                  <div class="cursor"
+                       style="padding: 8px; border-bottom: 1px solid #fff"
+                       @click="handleLink('/about/statutes')">
+                    制度公开
+                  </div>
+
+                  <div class="cursor"
+                       style="padding: 8px; border-bottom: 1px solid #fff"
+                       @click="handleLink('/common/interpretive')">
+                    讲解服务
+                  </div>
+                  <div class="cursor"
+                       style="padding: 8px"
+                       @click="handleLink('/common/audiencesurveys')">
+                    观众调查
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
     </div>
   </div>
 </template>
@@ -100,10 +196,12 @@ const route = useRoute();
 const router = useRouter();
 const state = reactive({
   activePage: "",
+  isH5: false,
 });
 onBeforeMount(() => {
   const currentPath = route.path;
   state.activePage = currentPath;
+  state.isH5 = localStorage.getItem("isH5");
 });
 
 const handleLink = (url) => {
@@ -148,4 +246,17 @@ const handleLink = (url) => {
   left: 50%;
   transform: translateX(-50%);
 }
+.menu-dom:hover .menu-hover-dom {
+  display: block;
+}
+
+.menu-hover-dom {
+  display: none;
+}
+.about-dom:hover .about-hover-dom {
+  display: block;
+}
+.about-hover-dom {
+  display: none;
+}
 </style>
diff --git a/src/views/homepage.vue b/src/views/homepage.vue
index ee10de7..47968d6 100644
--- a/src/views/homepage.vue
+++ b/src/views/homepage.vue
@@ -70,7 +70,7 @@
     </div>
 
     <div style="height: 145px; background: #000"
-         class="row justify-center color-white">
+         class="row justify-center color-white relative">
       <div class="col-6 col-md-4 row justify-around"
            style="margin-top: 32px; max-width: 300px">
         <div class="cursor"
@@ -83,6 +83,103 @@
           copyright 2024 最终所有权归延庆博物馆
         </div>
       </div>
+
+      <div v-if="state.isH5 == 'true'"
+           style="
+          border-radius: 50%;
+          position: absolute;
+          top: -60px;
+          left: 60px;
+          z-index: 10;
+        "
+           class="relative menu-dom">
+        <img src="../assets/images/icon-menu.png"
+             style="width: 32px" />
+
+        <div class="menu-hover-dom row justify-center"
+             style="
+            position: absolute;
+            top: -345px;
+            left: 18px;
+            z-index: 9;
+            padding-bottom: 20px;
+          ">
+          <div class="row justify-center fl-mt-lg"
+               style="
+              padding: 0 10px;
+              height: 340px;
+              width: 104px;
+              background: #000;
+            ">
+            <div class="cursor col-12 row items-center justify-center"
+                 style="border-bottom: 1px solid #fff"
+                 @click="handleLink('/home/navigation')">
+              首页
+            </div>
+            <div class="cursor col-12 row items-center justify-center"
+                 style="border-bottom: 1px solid #fff"
+                 @click="handleLink('')">
+              导航
+            </div>
+            <div class="cursor col-12 row items-center justify-center"
+                 style="border-bottom: 1px solid #fff"
+                 @click="handleLink('')">
+              展览
+            </div>
+            <div class="cursor col-12 row items-center justify-center"
+                 style="border-bottom: 1px solid #fff"
+                 @click="handleLink('')">
+              典藏
+            </div>
+            <div class="cursor col-12 row items-center justify-center"
+                 style="border-bottom: 1px solid #fff"
+                 @click="handleLink('')">
+              资讯
+            </div>
+            <div class="cursor col-12 row items-center justify-center"
+                 style="border-bottom: 1px solid #fff"
+                 @click="handleLink('')">
+              文创
+            </div>
+            <div class="cursor col-12 row items-center justify-center"
+                 style="border-bottom: 1px solid #fff"
+                 @click="handleLink('')">
+              数字文脉
+            </div>
+            <div class="cursor col-12 row items-center justify-center relative about-dom">
+              关于
+              <div class="about-hover-dom row justify-center"
+                   style="
+                  position: absolute;
+                  top: -122px;
+                  left: 120%;
+                  z-index: 9;
+                  padding-bottom: 20px;
+                ">
+                <div class="row justify-center fl-mt-lg"
+                     style="padding: 0 10px; width: 104px; background: #000">
+                  <div class="cursor"
+                       style="padding: 8px; border-bottom: 1px solid #fff"
+                       @click="handleLink('/about/statutes')">
+                    制度公开
+                  </div>
+
+                  <div class="cursor"
+                       style="padding: 8px; border-bottom: 1px solid #fff"
+                       @click="handleLink('/common/interpretive')">
+                    讲解服务
+                  </div>
+                  <div class="cursor"
+                       style="padding: 8px"
+                       @click="handleLink('/common/audiencesurveys')">
+                    观众调查
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
     </div>
   </div>
 </template>
@@ -100,10 +197,12 @@ const route = useRoute();
 const router = useRouter();
 const state = reactive({
   activePage: "",
+  isH5: false,
 });
 onBeforeMount(() => {
   const currentPath = route.path;
   state.activePage = currentPath;
+  state.isH5 = localStorage.getItem("isH5");
 });
 
 const handleLink = (url) => {
@@ -148,4 +247,17 @@ const handleLink = (url) => {
   left: 50%;
   transform: translateX(-50%);
 }
+.menu-dom:hover .menu-hover-dom {
+  display: block;
+}
+
+.menu-hover-dom {
+  display: none;
+}
+.about-dom:hover .about-hover-dom {
+  display: block;
+}
+.about-hover-dom {
+  display: none;
+}
 </style>