html에 이미지맵 사용법을 알고싶어요
html에서 하나의 이미지가 있으면
그 이미지안에 여러가지 위치를 설정하고
그 설정한 곳에 어떤것을 클릭하면 다른이벤트, 또 다른곳을 클릭하면 또 다른 이벤트를
발생시키고 싶어요
55글자 더 채워주세요.
2개의 답변이 있어요!
안녕하세요??
이미지 맵에 대해서 문의하셨는데 질문자님께서 문의하신내용이면 이미지맵 사용하는게 맞고
그 사용법은 예제로 통해서 알려드리겠습니다
<img src="imgmap.gif" alt="imgmap.gif" usemap="#001" border="0"> <map name="001"> <area shape="rect" coords="42,41,154,66" href="/01/homepage.php" target="_blank"> <area shape="rect" coords="42,76,152,100" href="/03/html.php" target="_blank"> <area shape="rect" coords="40,113,150,138" href="/05/html2.php" target="_blank"> </map>imgmap.gif이라는 이미지를 사용한거고 각 rect마다 다른 링크가 있고 저 링크는 상대적이기때문에
질문자님맞게 사용하시면 됩니다
- <!DOCTYPE html> <html> <body> <p>Click on the sun or on one of the planets to watch it closer:</p> <img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap"> <map name="planetmap"> <area shape="rect" coords="0,0,82,126" alt="Sun" href="sun.htm"> <area shape="circle" coords="90,58,3" alt="Mercury" href="mercur.htm"> <area shape="circle" coords="124,58,8" alt="Venus" href="venus.htm"> </map> </body> </html>
위에 소스처럼 사용하시면 됩니다
테스트하시면서 체크할려면 아래 링크 추천드려요
https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_areamap