2

在 www.peterbio.com/mom/test.htm 有一个小网页

有人用鼠标悬停并创建图像映射来编写代码。当您单击其中一个紫色气球时，会显示另一个图像。

  1. ***需要一些帮助添加更多代码，以便我可以将另一个鼠标悬停图片添加到图像中的不同气球。我不知道怎么。但是通过上面页面上的示例和代码补充，我可以学到一些东西。

然后我可以这样做，这样图片中的所有气球都会鼠标悬停并显示其他 JPG（稍后我将添加不同的图像）。您可以使用相同的 jpg 添加第二、第三等翻转图像。

  1. ***还需要知道我可以使用什么免费地图程序来创建图像地图，这样我就可以对其余的气球做同样的事情---除非---你好心将其他坐标添加到图像地图并使用相同的图像对于所有其他气球。

不确定图像是否需要预先处理。他们将是大约 110k 或更少。

非常感谢您的帮助。自从我母亲去世以来，我试图为我的家人做点什么。我想这是一种应对方式。个人电脑

4

1 回答 1

5 
<map name="momMap" id="momMap">

在这种情况下，每个区域都是一个气球，由坐标定义，然后动作“ onmouseover”触发javascript函数“ changeImage”，该函数采用属性“ newimage”，这是要显示的图像的名称。

您要设置的气球的坐标是成对插入的。例如，0,0 表示左上角，添加的对越多，形状的顶点就越多，连接这些顶点形成的区域将受 javascript 操作影响。

<area shape="poly" coords="326,93,316,136,275,165,250,163,235,127,261,100,286,66,308,68" href="#" onmouseover="changeImage('momf.jpg')" onmouseout="resetImage()"/>

所以“ poly”将区域类型设置为多边形，坐标定义了顶点的位置和数量。尽量保持这些顶点坐标的顺序，以避免混淆某些浏览器。除了多边形之外，您还可以使用其他形状，即圆形和矩形。此处描述了这些区域的使用。

你问了一个例子，这将在父图像左上角的 100px 正方形中显示相同的图像（因为我不知道该文件夹中的任何其他图像）：

<area shape="poly" coords="0,0,100,0,100,100,0,100" href="#" onmouseover="changeImage('momf.jpg')" onmouseout="resetImage()"/>

所以总而言之，您只需要为每个气球设置一个新区域，或者就此而言，您想要悬停效果的图像的任何区域。为了减轻您在图像上查找坐标的费用，我找到了这个脚本，它将减轻您的任务

于 2009-12-22T23:49:49.097 回答