이미지맵 썸네일형 리스트형 반응형 또는 모바일 페이지에 이미지맵(image map) 사용하기 이미지맵을 사용하여 홈페이지를 제작하는대 반응형으로 coding 하는경우 문제가 생깁니다. 원하는 영역의 크기가 변하기때문이죠. 이럴때 jquery 를 이용해서 해결 할 수 있습니다. jQuery RWD Image Maps Allows image maps to be used in a responsive design by recalculating the area coordinates to match the actual image size on load and window.resize Usage:•If possible, add correct, unitless width and height attributes to your image map images. You can override these in CSS .. 더보기 이미지맵 image map 확인 이미지맵이 걸려있는 경우 영역을 확인하기 힘들때가 있다. 또는 해당 영역을 스타일을 주고 싶을때도 있다. 이런 경우 확인 하는 방법이 있다. 출처 : http://davidlynch.org/projects/maphilight/docs/demo_simple.html 방법 이렇게 하면 mouse over 시 maphilight 에 있는 스타일이 영역에 적용되어 보인다. 더보기 jquery + image map 으로 지도나 이미지상에서 기능구현하기 예를 들어 전국지도가 있고 특정 지역을 이미지 상에서 클릭했을때 효과를 주고 기능을 부여할때 필요한 부분이다. - imagemapster 란 것을 만들어 제공해주는 곳이 있어 이곳에 들어가서 보면 demo 와 적용할수있는 다양항 기능들을 직접 조합해 볼수있다. http://www.outsharked.com/imagemapster/examples/usa.html 또한 아랫 사이트에선 직접 소스를 변경해가면서 테스트해 볼 수도 있다. http://jsfiddle.net/4cHtc/22/ ( ※ 이곳에서 이 소스뿐만이 아니라 다양한 샘플들을 테스트해볼수있으니 참고해보면 좋을거 같다.) - maphilight 란 것도 있는대 image map 이나 svg 파일등으로도 이용가능하다. http://davidlync.. 더보기 이전 1 다음