
// 메뉴 색상바
var $marker = $('<div class="marker"></div>').appendTo('.menu');
var $navitem = $('.menu > .menu-item');
var $current = $('.menu-item.current-menu-item');
if ($current.parents('.sub-menu').length) { // 2차 메뉴
$current = $current.closest('.menu-item-has-children');
}
function indicator($el) {
$marker.css({
left: $el.position().left + 20 + "px",
width: $el.outerWidth() - 40 + "px",
opacity: 1
});
}
if ($current.length) {
indicator($current);
}
$navitem.mouseenter(function() {
indicator($(this));
});
$(".menu").mouseleave(function() {
if ($current.length) {
indicator($current);
} else {
$marker.css({ opacity: 0, width: "0px" });
}
});
'Js' 카테고리의 다른 글
rotate, mouse move, delay (0) | 2025.03.07 |
---|---|
circle, strokeDashoffset, scrollTop, 그래프 (0) | 2025.03.06 |
gsap, mouse move (0) | 2025.03.05 |
원페이지 스크롤 (0) | 2025.03.03 |
폴리곤. 컬러 로테이션 hue-rotate (0) | 2025.02.24 |
createElement, mouse move (0) | 2025.02.23 |
Lottie json 파일 단순 마우스 오버 효과 (0) | 2024.10.17 |
replace(), 유튜브 클릭시 오토플레이 (0) | 2024.07.17 |