导航菜单主题色
All checks were successful
continuous-integration/drone/push Build is passing

This commit is contained in:
yiqiu
2026-01-10 17:56:38 +08:00
parent 9e3ae74b12
commit 6a70e41f88
2 changed files with 37 additions and 23 deletions

View File

@@ -133,7 +133,7 @@ $(function () {
$(".nav-menu .nav-item").hover(
function () {
const index = $(".nav-menu .nav-item").index($(this));
// 清除离开定时器
if (leaveTimer) {
clearTimeout(leaveTimer);
@@ -142,15 +142,20 @@ $(function () {
// 添加150ms延迟防止误触
hoverTimer = setTimeout(() => {
$(".nav-cont .nav-cont-menu")
.eq(index)
.css("display", "block");
const $menu = $(".nav-cont .nav-cont-menu").eq(index);
if (
!$(".nav-cont .nav-cont-menu").eq(index).hasClass("nav-cont-empty")
) {
const height = $(".nav-cont .nav-cont-menu").eq(index).outerHeight(true);
$(".nav-cont").css("height", height + "px");
if (!$menu.hasClass("nav-cont-empty")) {
// 1. 先让容器从0开始防止闪烁
$(".nav-cont").css("height", "0px");
// 2. 显示菜单但容器高度为0所以看不见
$menu.css("display", "block");
// 3. 立即获取高度并展开使用requestAnimationFrame确保渲染
requestAnimationFrame(() => {
const height = $menu.outerHeight(true);
$(".nav-cont").css("height", height + "px");
});
}
showIndex = index;
}, 150);
@@ -164,8 +169,12 @@ $(function () {
leaveTimer = setTimeout(() => {
const index = $(".nav-menu .nav-item").index($(this));
$(".nav-cont .nav-cont-menu").eq(index).css("display", "none");
// 先收起容器
$(".nav-cont").css("height", "0");
// 等动画完成后隐藏内容
setTimeout(() => {
$(".nav-cont .nav-cont-menu").eq(index).css("display", "none");
}, 300); // 等待transition完成
}, 100);
}
);
@@ -178,25 +187,28 @@ $(function () {
leaveTimer = null;
}
$(".nav-cont .nav-cont-menu")
.eq(showIndex)
.css("display", "block");
if (!$(".nav-cont .nav-cont-menu").eq(showIndex).hasClass("nav-cont-empty")) {
const height = $(".nav-cont .nav-cont-menu").eq(showIndex).outerHeight(true);
$(".nav-cont").css("height", height + "px");
const $menu = $(".nav-cont .nav-cont-menu").eq(showIndex);
$menu.css("display", "block");
if (!$menu.hasClass("nav-cont-empty")) {
requestAnimationFrame(() => {
const height = $menu.outerHeight(true);
$(".nav-cont").css("height", height + "px");
});
}
},
function () {
leaveTimer = setTimeout(() => {
$(".nav-cont .nav-cont-menu")
.eq(showIndex)
.css("display", "none");
// 先收起容器
$(".nav-cont").css("height", "0");
// 等动画完成后隐藏内容
setTimeout(() => {
$(".nav-cont .nav-cont-menu").eq(showIndex).css("display", "none");
}, 300);
}, 100);
}
);
if (localStorage.jwt) {
if (sessionStorage.accountInfo) {
const obj = JSON.parse(sessionStorage.accountInfo);