[JQUERY] HTML 이미지 맵으로 사용 JQuery와 호버

HTML 이미지 맵으로 사용 JQuery와 호버

해결법

1. ---

   1.이 플러그인을 체크 아웃해야합니다 :

   이 플러그인을 체크 아웃해야합니다 :

   https://github.com/kemayo/maphilight

   및 데모 :

   http://davidlynch.org/js/maphilight/docs/demo_usa.html

   어떤 경우에는 수정 당신에 일부 코드를 빌릴 수 있습니다.

2. ---

   2.이 질문은 오래하지만 당시 존재하지 않았던 허용 대답에 대한 대안을 추가하고 싶었다.

   이 질문은 오래하지만 당시 존재하지 않았던 허용 대답에 대한 대안을 추가하고 싶었다.

   이미지 Mapster 내가지도 Hilight의 단점 중 일부를 해결하기 위해 작성하는 jQuery 플러그인 (그리고 그 이후 거의 완전히 다시 작성되었습니다 비록 그것은 처음에 그 플러그인의 확장이었다). 처음에,이 영역에 대한 선택 상태, 수정 브라우저 호환성 문제를 유지하기 위해 단지 능력이었다. 초기 출시 된 이후 몇 개월 전,하지만, 나는 하이라이트의 소스로 다른 이미지를 사용하는 기능을 포함하여 기능을 많이 추가했습니다.

   그것은 또한 당신이 "구멍"로 영역을 생성하고, 추가로 지역의 복잡한 그룹을 만들 수 있습니다 의미 "마스크"로 영역을 식별 할 수있는 능력을 가지고 있습니다. 예를 들어, 영역 A는 또 다른 영역 (B)가 강조되도록 할 수 있지만, 지역 B 자체는 마우스 이벤트에 응답하지 않을 것입니다.

   대부분의 기능을 보여주는 웹 사이트에 대한 몇 가지 사례가있다. GitHub의 저장소는 더 많은 예제와 전체 문서가 있습니다.

3. ---

   3.나는 과거에 사용했다고이 멋진 매핑 스크립트 (mapper.js)를 발견했다. 무엇에 대해 다른 것은 당신이지도 또는지도 지역 하이라이트를 만들기 위해 페이지에 링크 위에 마우스를 올려 수 있습니다. 슬프게도이 자바 스크립트로 작성된에서 인라인 HTML 코딩을 많이 필요 것 -이 스크립트는 jQuery를에 포팅보고 싶어요 : P를

   나는 과거에 사용했다고이 멋진 매핑 스크립트 (mapper.js)를 발견했다. 무엇에 대해 다른 것은 당신이지도 또는지도 지역 하이라이트를 만들기 위해 페이지에 링크 위에 마우스를 올려 수 있습니다. 슬프게도이 자바 스크립트로 작성된에서 인라인 HTML 코딩을 많이 필요 것 -이 스크립트는 jQuery를에 포팅보고 싶어요 : P를

   또한, 모든 데모를 체크 아웃! 나는 (플래시를 사용하지 않고)이 예는 거의 간단한 온라인 게임으로 만들어 질 수 있다고 생각 - 당신이 다른 카메라 앵글을 클릭합니다.

4. ---

   4.jQuery를 Maphilight 플러그인이 일을하지만, 그것은 당신의 HTML에 이미지 맵 자세한 오래된에 의존한다. 나는 외부적인 mapcoordinates을 유지하는 것을 선호합니다. 이 JQuery와 이미지 맵 플러그인 JS로 될 수 있지만, 호버 상태 없다. 좋은 솔루션은 플래시 JS에서 구글으로 GeoMap 시각화한다. 그러나 vectordata 이런 종류의 오픈 소스의 미래는 그러나 SVG는 모든 최신 브라우저 전체의 SVG 지원을 고려하고, IE를위한 플래시 변환에 대한 svgweb을 구글의 왜 JQuery와 플러그인 JS 데모처럼 SVG지도에 대한 링크와 hoverstates을 추가 여기? 그런 식으로 당신은 또한 이미지 맵의 좌표에 vectormap 변환의 복잡한 단계를 피할 수 있습니다.

   jQuery를 Maphilight 플러그인이 일을하지만, 그것은 당신의 HTML에 이미지 맵 자세한 오래된에 의존한다. 나는 외부적인 mapcoordinates을 유지하는 것을 선호합니다. 이 JQuery와 이미지 맵 플러그인 JS로 될 수 있지만, 호버 상태 없다. 좋은 솔루션은 플래시 JS에서 구글으로 GeoMap 시각화한다. 그러나 vectordata 이런 종류의 오픈 소스의 미래는 그러나 SVG는 모든 최신 브라우저 전체의 SVG 지원을 고려하고, IE를위한 플래시 변환에 대한 svgweb을 구글의 왜 JQuery와 플러그인 JS 데모처럼 SVG지도에 대한 링크와 hoverstates을 추가 여기? 그런 식으로 당신은 또한 이미지 맵의 좌표에 vectormap 변환의 복잡한 단계를 피할 수 있습니다.

from https://stackoverflow.com/questions/745110/using-jquery-hover-with-html-image-map by cc-by-sa and MIT license