HTML5 게임을 제작 중이며 특정 방향으로 이동하면 항상 같은 결과를 얻을 수 있도록 특정 이벤트의 특정 컨트롤 위에 마우스 커서를 놓으려고합니다. 이게 가능해?
HTML5 게임을 제작 중이며 특정 방향으로 이동하면 항상 같은 결과를 얻을 수 있도록 특정 이벤트의 특정 컨트롤 위에 마우스 커서를 놓으려고합니다. 이게 가능해?
답변:
그래서 나는 이것이 오래된 주제라는 것을 알고 있지만 먼저 불가능하다고 말할 것입니다. 가장 가까운 것은 현재 마우스를 단일 위치에 고정하고 x와 y의 변화를 추적하는 것입니다. 이 개념은 Chrome과 Firefox처럼 채택되었습니다. 그것은 Mouse Lock 이라는 것으로 관리되며 탈출을 치면 깨질 것입니다. 내에서 간단한이 읽기까지, 나는 생각이 하나 개의 위치에 마우스를 고정, 이벤트 및 드래그 클릭 유사한 모션 이벤트를보고 있다고 생각합니다.
다음은 릴리스 문서입니다 :
파이어 폭스 : https://developer.mozilla.org/en-US/docs/Web/API/Pointer_Lock_API
크롬 : http://www.chromium.org/developers/design-documents/mouse-lock
그리고 여기 꽤 깔끔한 데모가 있습니다 : http://media.tojicode.com/q3bsp/
자바 스크립트로 마우스 포인터를 이동할 수 없습니다.
가능하다면 잠시 동안의 의미에 대해 생각하십시오.)
간단한 http 호출, AJAX 등을 통해 CGI 스크립트로 실행하십시오.
http://localhost:9876/cgi/mousemover?x=200&y=450
추신 : 어떤 문제 든, 왜, 어떻게 할 수 없는지, 어떻게해야하는지에 대한 수백 가지의 변명이 있습니다. 일어날 것입니다.
실제 (시스템) 마우스 커서를 사용하지 않으면 마우스 커서를 화면의 지정된 영역에 배치 할 수 있다고 생각합니다.
예를 들어, 커서 대신 작동 할 이미지를 생성하고 장면에서 마우스 입력을 감지하면 시스템 커서의 스타일을 '없음'( sceneElement.style.cursor = 'none'
)으로 설정 한 다음 숨겨진 이미지 요소가 작동 하는 이벤트를 처리 할 수 있습니다. 사전 정의 된 축 / 경계 상자 변환을 기반으로 장면에서 원하는 위치에 커서로 표시됩니다.
이 방법으로 실제 커서를 어떻게 이동했는지에 관계없이 번역 방법은 이미지 커서를 필요한 곳 어디에서나 유지할 수 있습니다.
좋은 질문입니다. 이것은 실제로 Javascript 브라우저 API에서 누락 된 것입니다. 또한 팀과 WebGL 게임을하고 있는데이 기능이 필요합니다. Firefox의 bugzilla에 대한 문제를 열어서 마우스 잠금을 허용하는 API가있을 가능성에 대해 이야기 할 수 있습니다. 이것은 모든 HTML5 / WebGL 게임 개발자에게 유용 할 것입니다.
원하는 경우 의견을 남기고 의견을 남기고 문제를 찬성하십시오.
https://bugzilla.mozilla.org/show_bug.cgi?id=630979
감사!
마우스 포인터의 위치를 감지 한 다음 웹 페이지 (본체의 상대 위치)를 클릭하여 클릭하려는 항목 위로 이동할 수 있습니다.
예를 들어 브라우저 콘솔의 현재 페이지에이 코드를 붙여 넣은 다음 나중에 새로 고칠 수 있습니다.
var upvote_position = $('#answer-12878316').position();
$('body').mousemove(function (event) {
$(this).css({
position: 'relative',
left: (event.pageX - upvote_position.left - 22) + 'px',
top: (event.pageY - upvote_position.top - 35) + 'px'
});
});
document.getElementByID('thingtoclick').click();
마우스를 움직일 수는 없지만 잠글 수는 있습니다. 참고 : click 이벤트에서 requestPointerLock을 호출해야합니다.
작은 예 :
var canvas = document.getElementById('mycanvas');
canvas.requestPointerLock = canvas.requestPointerLock || canvas.mozRequestPointerLock || canvas.webkitRequestPointerLock;
canvas.requestPointerLock();
설명서 및 전체 코드 예 :
https://developer.mozilla.org/en-US/docs/Web/API/Pointer_Lock_API
마우스 포인터의 실제 위치를 얻은 다음이 보상을 기반으로 스프라이트 / 장면 마우스 동작을 계산하고 보정하여 간단하게 수행 할 수 없습니까?
예를 들어, 마우스 포인터가 하단 중앙에 있어야하지만 왼쪽 상단에 있습니다. 커서를 숨기려면 이동 된 커서 이미지를 사용하십시오. 재배치 된 커서 스프라이트 (또는 '제어') 클릭과 일치하도록 커서 이동을 이동하고 마우스 입력을 매핑합니다. 경계에 도달하면 다시 계산합니다. 커서가 실제로 원하는 지점에 도달하면 보정을 제거하십시오.
면책 조항, 게임 개발자가 아닙니다.
흥미 롭군 이는 이전에 언급 된 이유로 (스팸 클릭 및 악성 코드 삽입) 직접적으로 가능하지는 않지만 다음과 같은 인상을주는이 해킹을 고려하십시오.
div가 있다고 가정하면이 CSS 속성을 사용하여 실제 커서를 숨길 수 있습니다.
.your_div {
cursor: none
}
커서 모양의 이미지를 만들어 웹 페이지 내에 위치 = '절대'로 배치하십시오.
이것은 쉬워요. 실제 마우스 위치 (X & Y 좌표)를 얻는 방법에 대해서는 인터넷을 확인하십시오.
실제 커서가 움직일 때 의사 커서를 동일한 X & Y 차이로 움직입니다. 마찬가지로 자바 스크립트 매직을 사용하여 웹 페이지의 어느 위치에서나 클릭 이벤트를 생성 할 수 있습니다 (사용 방법에서 인터넷 검색).
이제이 시점에서 의사 커서를 원하는 방식으로 제어 할 수 있으며 사용자는 실제 커서가 움직이는 느낌을받습니다.
====
공정한 경고 : 하지 마십시오. 특정 사용 사례가 없거나 사용자를 도망치려는 경우를 제외하고는 커서 나 컴퓨터가 이런 식으로 제어되기를 원하지 않습니다.