UIUX수정

This commit is contained in:
2025-05-19 21:35:52 +09:00
parent bbdd87be3f
commit ed9b8e8b3b
115 changed files with 7980 additions and 4892 deletions

View File

@@ -124,11 +124,20 @@ $(document).ready(function () {
let isEntered = false;
menu_init();
$(document).on("mouseenter", ".desktop .menu, .desktop .logoWrap", function () {
const $headerInner = $(".hederWarp_n .headerInner");
let $menuBg = $(".menuBg");
// menuBg가 없으면 생성 후 삽입
console.log($menuBg.length);
if ($menuBg.length <= 0) {
$menuBg = $('<div class="menuBg" style="height:0;"></div>');
$headerInner.append($menuBg);
}
$(document).on("mouseenter", ".desktop .gnb", function () {
if (isEntered) return;
isEntered = true;
$(".menuDepth2Wrap").hide().stop(true).fadeIn(200);
$(".menuDepth2Wrap").hide().stop(true).fadeIn(240);
$(".desktop .menu").addClass("open");
$(".desktop .hederWarp_n").addClass("menu-open");
@@ -136,21 +145,25 @@ $(document).ready(function () {
.toArray()
.map((el) => Math.floor($(el).outerHeight()));
const menuDepth2WrapHeight = Math.max(...menuDepth2WrapHeights);
$(".desktop .menuBg").css("height", menuDepth2WrapHeight);
// 강제로 리플로우 발생시켜야 transition 작동
requestAnimationFrame(() => {
$menuBg.css("height", `${menuDepth2WrapHeight + 80}px`);
});
});
$(document).on("mouseleave", ".desktop .gnb, .desktop .menuWarp", function (e) {
$(document).on("mouseleave", ".desktop .gnb, .desktop .menuBg", function (e) {
const toElement = e.relatedTarget;
// gnb, menuWarp, logoWrap, menu 내부로 이동한 경우는 무시
if ($(toElement).closest(".desktop .gnb, .desktop .menuWarp, .desktop .logoWrap, .desktop .menu").length > 0) {
if ($(toElement).closest(".desktop .gnb, .desktop .menuWarp, .desktop .logoWrap, .desktop .menuBg").length > 0) {
return;
}
$(".desktop .menuBg").css("height", "0");
$(".menuDepth2Wrap").hide().stop(true);
$(".desktop .menu").removeClass("open");
$(".desktop .hederWarp_n").removeClass("menu-open");
$(".desktop .menuBg").css("height", "0");
isEntered = false;
});
}
@@ -195,12 +208,12 @@ $(document).ready(function () {
});
//자동차 번호/메뉴/로그인 선택 슬라이드
$(".carlist, .carItem, .menu > a, .user > a")
$(".menu > a, .user > a")
.on("mouseover focusin", function () {
$(this).addClass("on");
$(this).next(".carlistItem, .gnbMenu, .userMenu").addClass("on");
$(this).next(".gnbMenu, .userMenu").addClass("on");
$(this)
.next(".carlistItem, .gnbMenu, .userMenu")
.next(".gnbMenu, .userMenu")
.on("mouseover focusin", function () {
$(this).addClass("on");
})
@@ -210,10 +223,27 @@ $(document).ready(function () {
})
.on("mouseleave", function () {
$(this).removeClass("on");
$(this).next(".carlistItem, .gnbMenu, .userMenu").removeClass("on");
$(this).parents(".carlist").removeClass("on");
$(this).next(".gnbMenu, .userMenu").removeClass("on");
});
let isOverCarItem = false;
let isOverCarlistItem = false;
$(".carlist").on("mouseenter", function () {
isOverCarItem = true;
$(".carItem, .carlistItem").addClass("on");
});
$(".carlist").on("mouseleave", function () {
isOverCarItem = false;
setTimeout(removeOnClassIfNeeded, 10);
});
function removeOnClassIfNeeded() {
if (!isOverCarItem && !isOverCarlistItem) {
$(".carItem, .carlistItem").removeClass("on");
}
}
$("#slide-open").click(function () {
if ($("#burgur").hasClass("on")) {
$("#burgur").removeClass("on");