如何制作具有精确图像形状的MouseOver?

时间:2009-11-06 15:09:26

标签: javascript html implementation

下面的问题并不是一个真正的编程问题,而是更多的“如何做到这一点”的问题,实施建议。

我有世界地图的图像。我可以使每个大陆成为一个单独的图像。

我想要做的是为每个大陆创建一个悬停在功能上的功能。当用户鼠标位于非洲大陆时 - 非洲大陆的 EXACT 形状 - 我希望它能够改变颜色。

我的主要问题是,如何在用户鼠标位于非洲大陆的完全形状时引用?我不想为此使用Flash,尽管我担心没有其他方法可以做到这一点吗?

全部谢谢

4 个答案:

答案 0 :(得分:6)

我知道如何执行此操作(没有外部库或js)的唯一方法是使用<map>。您将必须放入坐标和形状(在本例中为形状的多边形)以匹配您想要允许的区域:http://www.w3schools.com/TAGS/tag_map.asp

答案 1 :(得分:5)

在回答您的主要问题时,您可能需要使用旧的图像映射。 This image map generator过去对我有用。

至于让它们改变颜色,你总是可以使用精灵,只是在悬停时改变每个国家的背景位置?

答案 2 :(得分:4)

答案 3 :(得分:1)

这取决于您的平台(web,winform,linux,os x等)。

在网络上,您可以使用图片地图。

在任何操作系统托管的应用程序中,您可以使用区域执行相当于图像映射的操作。或者你甚至可以测试你正在悬停的像素的颜色。