이미지 매핑 생성하기
이미지 맵은 다음과 같습니다. (1) 서버 쪽 이미지 맵: 클릭한 좌표를 서버에 보내고 서버의 스크립트에 의해 결정됩니다.(2) 클라이언트 이미지 매핑: 클릭 위치에 따라 링크 목적을 결정합니다.
를 통해
<img/>
및 설정을 추가합니다.<map> <area>
원소는 비치는 시작<map>
원소는 각 구역을 표시하고 그림을 4개 구역으로 나누려면 4개의area를 사용한다.<area>
원소는name 속성만 있습니다.다음은 area 요소의 속성을 소개합니다. (1)shape: 반드시 필요한 속성입니다. 구역의 모양을 설명하는 데 사용됩니다. rectangle\poly\circle\default는 선택할 수 있습니다. default는 아직 정의되지 않은 구역을 가리킵니다.(2)coords: 영역의 좌표를 지정합니다.예를 들어 직사각형은 4개의 좌표가 있는데 앞의 두 개는 왼쪽 상각의 x, y 좌표이고 뒤의 두 개는 오른쪽 하각의 x, y 좌표이다.(3)href와nohref:href가 지정한 목적의 링크입니다. href 속성을 지정하지 않으면nohref,nohref="nohref"(4)target:<map>
와 같습니다.주의점: (1)
<a>
에서usemap 속성을 설정합니다.(2) <img>
에name 속성을 설정합니다.<html>
<head><title>Home</title></head>
<body>
<object data = "flash_sample.swf"></object>
<a href = "http://blog.csdn.net/xiazdong" target = "_blank"><img src="images/apple.jpg"/></a>
<img src = "images/apple.jpg" alt = "apple" usemap = "#map1" height = "100" width = "100"/>
<map name = "map1">
<area shape = "rect" coords = "0,0,50,50" href = "ImageDemo.html">
<area shape = "rect" coords = "50,50,100,100" href = "http://www.google.com/">
<area shape = "rect" coords = "0,50,50,100" href = "http://www.baidu.com/">
<area shape = "rect" coords = "50,0,100,50" href = "http://www.renren.com/">
</map>
</body>
</html>
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다른 사람의 웹사이트 편집: contenteditable 및 designMode그래도 우리가 그렇게 할 수 있다고 생각하는 것은 멋진 일입니다. 제가 강조하고 싶었던 일종의 관련 API가 실제로 몇 개 있기 때문에 오늘 그것을 가져왔습니다. contenteditable는 "true" 값이 할당...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.