JS

[JS] 마우스 올리기 내리기 / hover() vs mouseEnter

litzoo 2025. 4. 9. 10:00

hover()는 간편하고 자주 쓰는 방식이다

바로 사용법 알려드림

element 위를 뛰어넘는 mouse 찍찍

✅ 예시 1: hover() 사용

$("#listForm tr").hover(
    function () {
        // 마우스 진입 시
        $(this).css("background-color", "#f5f5f5");
    },
    function () {
        // 마우스 이탈 시
        $(this).css("background-color", "");
    }
);

 

✅ 예시 2: mouseenter + mouseleave 별도로 사용

$("#listForm tr").on("mouseenter", function () {
    $(this).css("background-color", "#f5f5f5");
});
$("#listForm tr").on("mouseleave", function () {
    $(this).css("background-color", "");
});

 

이렇게 함으로써...

(좌) hover 적용 전, (우) hover 적용 후

 

내 마우스가 어디를 가리키고 있는지 

바로 알 수 있잖아~

당신은 이제 센스있는 개발자!

728x90
반응형