修复手机端tab栏吸顶时被header遮挡一半的问题:动态计算header高度

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
zdh
2026-05-23 08:56:05 +08:00
parent 8f1217473f
commit 4f9eb50ac6
@@ -62,7 +62,7 @@ body {
/* ===== Nav tabs ===== */
.nav-wrap {
position: sticky; top: 52px; z-index: 90;
position: sticky; top: var(--header-h, 64px); z-index: 90;
background: rgba(255,255,255,0.88); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
border-bottom: 0.5px solid rgba(0,0,0,0.06);
}
@@ -1302,6 +1302,14 @@ function toggleCard(head) {
card.classList.toggle('open');
}
// Fix nav-wrap top to match actual header height
function syncNavTop() {
var h = document.querySelector('.header').offsetHeight;
document.documentElement.style.setProperty('--header-h', h + 'px');
}
syncNavTop();
window.addEventListener('resize', syncNavTop);
// Expand/collapse all
function toggleAll(btn) {
var section = btn.parentElement;