jQuery | javascript | CSS

16.XHTML- 이미지맵

Godffs 2009. 7. 27. 14:04
반응형
이미지맵이란 이미지를 클릭했을때 발생되는 이벤트를 지정하는 것입니다.
예) 배너와 같다고 보시면 좋습니다. (이미지 클릭시 지정된 사이트로 이동)

<img src="./imges/jc.jpg" alt="이준철" usemap="#go"/>

<map name="go">
    <rea alt="준철이 블로그" coords="0,0,50,50" href="http://godffs.tistory.com"
      shape="rect" target="_blank" />
</map>

 코드 설명입니다.
<img src="./imges/jc.jpg" alt="이준철" usemap="#go"/>
usemap="#go"은 책갈피와 비슷한 기능으로 usemap이름을 go로 했습니다.
책갈피니깐 # 이 앞에 붙어야겠죠?


<map name="go">
   map 이름을 go로 임의로 지정
    <area alt="준철이 블로그" coords="0,0,50,50" href="http://godffs.tistory.com"
     coords는 좌표를 지정해 주기 위해 사용된 것으로 X+Y 부터 X+Y표 지정 클릭시 사이트로 이동
      shape="rect" target="_blank" />
      shape는 모양으로 rect는 사각형, circle는 원형, poly는 마름모입니다.
(target관련강좌 : 14장 하이퍼링크 참고)
</map>

반응형