可以用Javascript制作Imagemap。为此,我们像往常一样使用<img>标记,但是需要将附加属性与图像标记一起使用,即“usemap”属性。接下来我们需要使用map标签,它只需要一个属性。name属性,此属性的值是图像标记中使用的usemap属性的值。此外,地图标签作为区域标签的容器标签工作,该标签定义了形状和坐标,以指定点或者区域,当我们单击该点或者区域时,我们将导航到另一个页面或者图像。
JavaScript代码:
<html>
<head>
<title>JavaScript Image Map</title>
<script type="text/javascript">
<!--
function showTutorial(name) {
document.myfrm.mytext.value = name
}
//-->
</script>
</head>
<body>
<form name="myfrm">
<input type="text" name="mytext" size="20"
</form>
<!-- Create Mappings -->
<img src="file:///map.jpg"
height="30%" width="30%" alt="HTML Map" border="0" usemap="#tutorials"
<map name="tutorials">
<area shape="poly" coords="74,0,113,29,98,72,52,72,38,27" href="http://www.google.com/"
alt="Google" target="_self" onmouseover="showTutorial('google')" onmouseout="showTutorial('')"
<area shape="rect" coords="22,83,126,125" href="https://accounts.google.com/" alt="Gmail"
target="_self" onmouseover="showTutorial('Gmail')" onmouseout="showTutorial('')"
<area shape="circle" coords="73,168,32" href="http://in.yahoo.com/?p=us" alt="Yahoo"
target="_self" onmouseover="showTutorial('Yahoo')" onmouseout="showTutorial('')"
</map>
</body>
</html>
日期:2020-04-11 23:04:37 来源:oir作者:oir
