>웹 프론트엔드 >JS 튜토리얼 >마우스 움직임에 따라 jQuery 레이어 효과를 구현하는 방법_jquery

마우스 움직임에 따라 jQuery 레이어 효과를 구현하는 방법_jquery

WBOY
WBOY원래의
2016-05-16 16:16:161471검색

이 기사의 예에서는 jQuery가 마우스 움직임에 따른 레이어 효과를 구현하는 방법을 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 구체적인 분석은 다음과 같습니다.

1. 기본 목표

마우스 움직임을 따라가는 레이어를 작성하고,

현재 마우스 위치가 레이어에 표시됩니다.

아래 그림과 같습니다.

이 레이어가 javascript 대신 jQuery를 사용하는 이유는 jQuery 코드가 현재의 모든 주류 브라우저와 쉽게 호환되기 때문입니다. 적어도 IE8에서는 호환성을 위해 사용됩니다.

2. 제작과정

이 실험의 핵심은 jquery의 mousemove 이벤트입니다.

마우스가 움직일 때 트리거됩니다.

코드는 다음과 같습니다.

코드 복사 코드는 다음과 같습니다.

마우스제목>