>  기사  >  웹 프론트엔드  >  Node.js는 마우스 클릭 위치 구현 아이디어와 code_javascript 기술을 얻습니다.

Node.js는 마우스 클릭 위치 구현 아이디어와 code_javascript 기술을 얻습니다.

WBOY
WBOY원래의
2016-05-16 16:49:081526검색

복사되었지만 원본 페이지의 코드는 여전히 수정해야 합니다. 다음은 사용 가능한 수정 사항입니다.

일반적으로 가로 및 세로 위치를 각각 가져오는 데 event.clientX 및 event.clientY가 사용되지만 이 방법만 사용합니다. 예, event.clientX 및 event.clientY에서 얻은 마우스 위치는 페이지의 스크롤 막대가 스크롤한 거리에 관계없이 현재 화면을 기준으로 하기 때문입니다.

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

함수 포인터X(이벤트)
{
return event.pageX || (event.clientX (document.documentElement.scrollLeft || document.body.scrollLeft))
}

function 포인터Y(event)
{
return event .pageY || (event.clientY (document.documentElement.scrollTop || document.body.scrollTop))
}

두 메소드는 각각 상대적인 전체 페이지( 화면 대신) 마우스 위치

event.pageX는 FF에서 지원되므로 브라우저 간 동작이 가능합니다

이 두 함수를 다른 메소드로 호출하면 됩니다
코드 복사 코드는 다음과 같습니다.

function getPointPosition(event)
{
var x_px_scr = event. clientX;
var y_px_scr = event.clientY;
alert("현재 화면을 기준으로 한 X축 오프셋" x_px_scr); //기기(PC 또는 모바일 기기)에 상대적
alert("현재 화면을 기준으로 한 Y축 오프셋" y_px_scr);//기기(PC 또는 모바일 기기)에 상대적
var x_Px_page =pointerX(event);
var y_Px_page =pointerY(event);
alert("전체 페이지를 기준으로 한 X축 오프셋" x_Px_page); "전체 페이지를 기준으로 한 Y축 오프셋" y_Px_page) //브라우저를 기준으로 함
}

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.