单击透明的.png答案

【问题标题】：Clicking through a transparent .png单击透明的.png
【发布时间】：2011-03-06 01:50:12
【问题描述】：

首先，我想说 myspace 很痛苦。但是，音乐家喜欢它，我可以为他们做布局赚一些钱。我在 myspace 的原始外观上覆盖了一层 .png，但需要使用 myspace 音乐播放器。所以，我制作了一个围绕 myspace 播放器的相框，它有一个透明的中心，这样你就可以看到 myspace 播放器。不幸的是，播放器没有完整的功能。当我悬停时它似乎正确响应，但当我单击时却没有。有谁知道如何解决这个问题？

你可以在这里看到我在说什么：myspace.com/gprettydesigns

【问题讨论】：

遗憾的是，PNG 位于您的 Flash 片段顶部的图层中，您无法单击它。[1]一个可能的解决方案是，或者将图像切片，使其不覆盖 flash 元素，或者尝试将 flash 对象放在图像顶部（想到 z-index。）[1]：stackoverflow.com/questions/1001551/…跨度>

标签： html css png transparent myspace

【解决方案1】：

添加

pointer-events: none;

在您的叠加层上以允许点击事件通过它。这是一个相当新的属性，因此并非所有浏览器都可以理解它。

https://developer.mozilla.org/en/css/pointer-events上有关指针事件的更多信息

【讨论】：

非常感谢您的帮助:)！
在 IE11 上工作

【解决方案2】：

最好的方法通常是将图像切成小块并放置，这样音乐播放器上就不会覆盖任何东西。

【讨论】：

【解决方案3】：

也许您可以使用 z-index 将图像定位在播放器下方，更多信息请参见：http://www.echoecho.com/csslayers.htm

【讨论】：

【解决方案4】：

将背景图片放在 div 上，然后使用 z-index 将其定位在播放器后面。将背景图像放在 div 上并使用 z-index 的优点是它比使用实际的内联图像更快。

【讨论】：

【解决方案5】：

拍拍拍拍给你！我已经完成了 MySpace 的一些调整，并且知道这是一个真正的 PITA。

在此处更改 CSS：

#shell {
    visibility:hidden;
    z-index:200;
}

我不记得这是否可行，或者他们是否只接受内联 CSS。

与问题无关，但现在您也可以通过RootMusic 在 facebook 上创建乐队页面。 MySpace 可能很快就会被人满为患，所以我也给他们看看。

祝你好运处理 MySpace 的意大利面条表。

【讨论】：