hover 이벤트로 translateY 조절 시 경계선에서 버벅임이 무한 반복되는 이슈를 해결할 수 있는 방법이 있을까요? 채택완료
우우우웅이
4년 전
조회 863
.item { position: relative; width: 472px; height: 686px; transition: transform 250ms; }
.item.hover { transform: translateY(-20px); }
코드는 위와 같고요,

hover 시에 정상 작동하긴 하는데
* 하단 경계선에 마우스를 가져다대면

이처럼 계속 떨리는 현상이 발생되는데..
1) hover 이벤트로 인해 이벤트 대상이 위로 올라가면서
2) 경계선 부분에 위치한 마우스가 벗어나게 되고
3) hover 이벤트가 풀리면서 제자리로 돌아오게 되고
4) 다시 hover 이벤트가 발생되면서
5) 무한 루프를 돌고 있는 것 같은데..
위와 같은 이슈를 해결할 수 있는 방안이나 팁이 있을까요 ?
댓글을 작성하려면 로그인이 필요합니다.
답변 1개
답변을 작성하려면 로그인이 필요합니다.
로그인