diff --git a/assets/style.css b/assets/style.css index 58f629b..0ccfa50 100644 --- a/assets/style.css +++ b/assets/style.css @@ -168,7 +168,7 @@ body.loaded .layout { width: 100%; padding: 0 1rem; justify-content: space-between; - z-index: 1000; /* 确保在最上层 */ + z-index: 900; /* 修改z-index,确保按钮层级高于基础内容但低于弹出面板 */ pointer-events: none; /* 防止按钮区域阻挡其他内容 */ } @@ -212,7 +212,7 @@ body.loaded .layout { opacity: 0; visibility: hidden; transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1); - z-index: 90; + z-index: 950; /* 调整遮罩层z-index,处于按钮与弹出面板之间 */ backdrop-filter: blur(4px); } @@ -1127,6 +1127,7 @@ body .content.expanded { .sidebar.active { transform: translateX(0); box-shadow: 2px 0 10px var(--shadow-color); + z-index: 1000; /* 增加侧边栏激活时的z-index,确保显示在按钮之上 */ } /* 重置移动端下的侧边栏展开状态 */ @@ -1167,6 +1168,7 @@ body .content.expanded { .search-container.active { transform: translateY(0); + z-index: 1000; /* 增加搜索容器激活时的z-index,确保显示在按钮之上 */ } .search-box { diff --git a/src/script.js b/src/script.js index 3c56cb1..ea3edb9 100644 --- a/src/script.js +++ b/src/script.js @@ -570,6 +570,11 @@ document.addEventListener('DOMContentLoaded', () => { const pageId = item.getAttribute('data-page'); if (pageId) { showPage(pageId); + + // 在移动端视图下点击导航项后自动收起侧边栏 + if (isMobile() && isSidebarOpen) { + closeAllPanels(); + } } }); });