可以用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