HTML5 -지도 영역 하이라이트로 iPad 주소 표시 줄 돋보기 만들기

iPad 용 HTML 페이지에서 여러 이미지 맵 영역을 강조 표시하는 예제를 작성하려고합니다. 이 아이디어는 모바일 사파리 주소 표시 줄을 길게 누를 때 돋보기 기능과 유사합니다. 돋보기를 좌우로 움직여 특정 문자로 이동할 수 있습니다. 나는 이미지 맵 "폴리"영역을 강조하기 위해 동일한 사용자 경험을 활용하려고 노력하고 있습니다. 돋보기를 패닝하면 강조 표시하고 활성화하여 영역을 스크롤하고 싶습니다.HTML5 -지도 영역 하이라이트로 iPad 주소 표시 줄 돋보기 만들기

나는 영역 사이의 실제 스크롤은 CSS/JS 돋보기 샘플 http://persistent.info/files/20040508.magnifier/ http://davidlynch.org/projects/maphilight/docs/

alongwith 내가 붙어있어 장소를 JQuery와 Maphighlight 플러그인을 사용한다 생각하고 자동으로 강조하고있다.

누구든지 내가 달성하려고하는 것과 비슷한 것을했는지 궁금합니다.

건배! Sameer

출처

2013-04-01 smaira

나는 당신이 원하는 것을 개념적으로 이해하지 못했지만 어떤 경우에도 도움이 될 수 있습니다.

는 의사 클래스를 사용하여 CSS와 태그의 활성화는 단순히 줌을 시뮬레이션 변환 CSS 사용했습니다이 데모에서

을 추가 할 수 있지만 당신이 원하는 무엇으로 대체 할 수있다. 나는 당신이 순수한 CSS 옵션을보다 빨리 발견 할 것이라고 생각한다.

http://jsfiddle.net/thurstanh/QEudm/5/

<body ontouchstart="">

CSS IMG : 활성 { -webkit-변환 : 스케일 (2,2); }

출처

2013-04-01 11:41:13 Thurstan

답장을 보내 주셔서 감사합니다.이 점은 확대/축소에 도움이되지만 내 큰 문제는 확대 된 상태에서 영역지도의 영역을 선택하는 것입니다. 캔버스 방식으로 해결하려고합니다. 사수 게임과 비슷합니다. – smaira

HTML5 -지도 영역 하이라이트로 iPad 주소 표시 줄 돋보기 만들기

답변

관련 문제