Fully Responsive Image Maps In jQuery - rwdImageMaps.js
해피팀
네티즌
소스분류
이미지관련
다운로드 횟수
17 회
간단설명
이미지 맵은 이미지 내의 개별 영역을 고유한 대상에 연결하여 작동합니다. 정적 그래픽 또는 사진에 상호 작용을 추가하기 위한 완벽한 솔루션입니다.
평가하기
이미지 맵은 이미지 내의 개별 영역을 고유한 대상에 연결하여 작동합니다.
정적 그래픽 또는 사진에 상호 작용을 추가하기 위한 완벽한 솔루션입니다.
이미지 맵의 단점은 브라우저 창의 크기를 변경할 때 픽셀 좌표도최신 상태로 유지해야한다는 것입니다.
이것이 바로 rwdImageMaps.js 플러그인이 들어오는 곳입니다.
rwdImageMaps.js는
모든 장치 및 브라우저에서 완벽하게 반응하는 이미지 맵을 만들기위한 경량 jQuery 플러그인입니다.
원본 이미지 크기와 현재 브라우저 창의 크기를 기반으로 이미지 맵의 좌표를 자동으로 다시 계산하고 업데이트합니다.
이미지를 클릭한 위치에 따라서,
위 그림과 같이 다른 경고창이 뜨도록 이미지맵을 지정할수 있습니다.
사용방법은 아래와 같습니다.
반응형 이미지가 되므로,
디바이스의 화면크기에 따라서 좌표를 다르게 지정하지 않아도 된다는 것이 장점이네요.
네티즌 의견이용하신 자료의 후기를 자유롭게 작성하세요. (상업적인 광고 및 도배성 글 등은 사전통보없이 삭제될 수 있습니다.)
