> 웹 프론트엔드 > JS 튜토리얼 > jquery mousemove 이벤트 마우스가 그림 위로 슬라이드됩니다.

jquery mousemove 이벤트 마우스가 그림 위로 슬라이드됩니다.

黄舟
풀어 주다: 2017-06-28 10:23:00
원래의
1367명이 탐색했습니다.

해결해야 할 문제: 사진에서 마우스가 멈췄을 때, 현재 사진의 관련 정보,

첫 번째 느낌은 마우스를 사용하는 것입니다 이벤트: 마우스가 사진 위에 머물 때. 해당 표시된 이벤트가 트리거될 수 있으며, 마우스아웃이 종료되면 숨겨진 이벤트가 트리거됩니다. 그러나 실제 완료 중에 마우스가 그림에 머무르면 정보가 계속 흔들리는 것으로 확인되었습니다. 매뉴얼에서 mouseover 이벤트에 대한 설명은 다음과 같습니다.

참고: 사용자가 마우스를 한 픽셀 이동하면 mousemove 이벤트가 발생합니다. 모든 mousemove 이벤트를 처리하려면 시스템 리소스가 소모됩니다. 이 이벤트를 주의 깊게 사용하시기 바랍니다.


즉, 마우스를 흔들면 단 한 픽셀이라도 디스플레이 이벤트가 발생합니다. 그러면 그림 정보 리소스가 발생하게 됩니다.

해결 방법은 다음과 같습니다. 공식 매뉴얼에서는 이 방법을 설명합니다.

호버 이벤트(마우스가

객체

위아래로 이동)를 시뮬레이션하는 방법입니다. 이는 자주 사용되는 작업에 대해 "유지" 상태를 제공하는 사용자 정의 방법입니다. 일치하는 요소 위로 마우스를 이동하면 지정된 첫 번째

함수

가 실행됩니다. 마우스가 이 요소 밖으로 이동하면 지정된 두 번째 기능이 트리거됩니다. 또한 마우스가 여전히 특정 요소(예: p의 이미지)에 있는지 여부를 감지하여 이동 이벤트를 트리거하지 않고 계속 "호버" 상태를 유지합니다( mouseout 이벤트 사용 시 일반적인 실수)를 수정했습니다. 예제 코드:

$("td").hover(
  function () {
    $(this).addClass("hover");
  },
  function () {
    $(this).removeClass("hover");
  }
);
로그인 후 복사

위 내용은 jquery mousemove 이벤트 마우스가 그림 위로 슬라이드됩니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿