728x90
반응형
이미지를 두개를 겹쳐둔 후
하나는 배경처럼 이용하고,
하나는
clip-path를 이용해 이미지의 특정 부위만 보이도록한다.
보여질 위치는 mousemove 이벤트를 이용해 이미지 위에서 움지이는 마우스를 감지해
event.offsetX와 event.offsetY 현재 영역에서의 마우스 위치를 찾아 값을 지정해준다.
clip-path를 이용한 또다른 효과
728x90
반응형
'javascript > jQuery' 카테고리의 다른 글
| [제이쿼리(jQuery) 플러그인] 페이지 스크롤 (0) | 2019.06.18 |
|---|---|
| [jQuery] 마우스를 따라 움직이는 이미지 (396) | 2019.06.05 |
| [jQuery 플러그인]원형차트그리기 jquery-circle-progress 사용법 (391) | 2019.06.05 |
| [jQuery]input 태그에 하이라이트 라인 추가하기 (408) | 2019.06.03 |
| [jQuery]마우스 움직임에 따라 이미지 위치 변경 (389) | 2019.06.03 |
댓글