Javascript 仅在图像的不透明部分悬停

有没有办法使图像的非透明部分触发鼠标悬停事件

如果鼠标移动到透明区域，则应触发鼠标移出，脚本应侦听图像下方层上的任何鼠标悬停事件

可能吗？谢谢你的意见

编辑：

---

我希望在不使用flash的情况下完成此操作。

据我所知，目前无法检测图像的透明部分。

您可以创建一个具有固定高度的子div，其大小与透明区域大致相同，绝对位于其上方，背景和边框为空白，然后将脚本添加到acitvate该div，或者div中的内容。

您可以映射出图像的透明部分的位置（在本例中，我希望您可以在某些浏览器的客户端代码中这样做），然后比较

mousemove

事件上事件的位置，查看指针是否在透明部分上。然后，您只需要添加一个变量来跟踪上次检查时是否超过了该部分。

如果您使用Flash，这是可能的

这里有一些提示

• 使用Flash加载非比例图像，在Flash中编写click事件处理程序（并在单击时将其传递给javascript）
• 加载带有透明标志的flash对象
• 将对象或嵌入标记设置为非常大的zIndex，如9999或其他东西，使其位于顶部

---

您可以将图像与老式的

和
）一起使用。

但是，动态创建地图并没有好方法——您必须手动创建地图，或者调用服务器端服务来绘制地图。
看起来是一种很容易获得图像区域地图的好方法。跨浏览器工作（IE6+，需要jQuery）

另一种选择是使用它创建SVG向量图像，这些图像被转换为从IE6到以上的所有功能（我相信，除了一些旧Android手机中的股票浏览器之外的所有功能）。它们可以通过各种方式使用javascript进行控制，并且可以具有所有标准事件，例如鼠标悬停、单击等

Raphael在这里比Flash选项工作得更好，因为它不依赖Flash。它没有“区域地图”选项简单，并且具有陡峭的学习曲线，但是，对于复杂情况和动态变化的形状，它带来了控制创建的矢量图像的多种方法的额外好处
 为什么单击事件？在Flash中，如何确定图像的哪些部分是透明的，以便知道将事件放置在何处？@David，在Flash中，如果在图像上附加click事件，则只能在不透明的图像上执行。我只是现在没有例子来展示，但我肯定以前做过，也见过其他人。当鼠标移动到不透明区域时，点击事件将如何帮助检测？@David，你知道，Flash可以在每个对象内部编写代码，比如图像，图像可以是png或gif，Flash了解图像的透明度，而将点击事件放在图像中只能钩住可见的部分。好吧，我明白不看一个例子很难理解。看起来OP刚才提到他不想使用flash，所以可能有机会我会这样做。谢谢。这给我指明了前进的道路。让我等一下，看看能不能得到更多的答案。这可能是你最好的选择。逐渐减少的好主意包括a）在图像的非透明部分上分层透明div，并将单击事件添加到这些div中；b）使用Flash，但那应该是最后的手段。正如你所说，我最终使用了经典的图像地图。在没有flash的情况下，找不到任何其他好方法来处理它。我的客户的网站将落后于一个相对较慢的连接，因此不得不从代码中挤出每千字节。谢谢