어떻게 이미지 맵 영역

Question

jsFiddle

내가 터치 스크린을위한 웹 응용 프로그램을 만들고 있어요에 커서를 숨 깁니다. 이것은 내가 화면에 마우스가 필요 없다는 것을 의미합니다!

전체 페이지에서 커서를 숨기기 위해 cursor:none;을 사용하고 있지만 어떻게 든 이미지 맵 영역에서는 작동하지 않습니다. 다음으로

각 영역

이 이루어진다 : 내가 href="#"을 삭제하고 HREF가 검증을 위해 필요한 경우

<area shape="rect" onclick="buttonPressed_DigitalKeyboard('Q');" coords="14,13,94,93" alt="" href="#"> 

커서는 일반 포인터로 변경 않습니다.

는

어떤 제안이 예를 들어이 Fiddle를 참조하십시오?

---

[편집] 나는 Google 크롬으로 제한됩니다! (HTML5 파일 시스템을 지원하고 내가 사용 기타 옵션)

---

[EDIT 2

해킹 : GREGER 어느 작동하지 않는 한 (1)의 불투명도 1x1 픽셀을 사용하여
jsFiddle 2

Answer 1

http://jsfiddle.net/BaEks/

은 커서를 추가 : 없음; 면적 태그

나에 대한 :

* { 
    cursor: none; 
} 

[업데이트] 자바 스크립트 대신지도/지역-태그의

사용

예 :

$("img#appkeyboard").click(function(e) { 
    var off = $(this).offset(); 
    var cx = e.clientX - off.left; 
    var cy = e.clientY - off.top; 
    if (cy > 17 && cy < 99) { // 1 row 
     if (cx > 17 && cx < 99) { 
      alert("button Q is pressed!"); 
     } else if (cx > 56 && cx < 202) { 
      alert("button W is pressed!"); 
     } 
     // .... 
    } else if (cy > 114 && cy < 195) { // 2 row 
     if (cx > 52 && cx < 135) { 
      alert("button A is pressed!"); 
     } else if (cx > 155 && cx < 237) { 
      alert("button S is pressed!"); 
     } 
     // .... 
    } else if (cy > 211 && cy < 291) { // 3 row 
     if (cx > 90 && cx < 170) { 
      alert("button Z is pressed!"); 
     } 
     // .... 
    } 
}); 

참조 : http://jsfiddle.net/RadVp/1/