Question

我能找到的最接近我想做的事情就是这样，但听起来这不再是一个可行的解决方案而且它并不是特定于iFrames： Click through a DIV to underlying elements

基本上我有一个DIV被添加到包含iFrame的页面。 iFrame内容可以最小化，因此它们不会占用iFrame的所有空间。 iFrame是透明的，因此您仍然可以看到它背后的网页。 我需要能够点击其背后的网页中的元素，但到目前为止还没有运气。

他们有大约400x400的iFrame，但当其中的内容被最小化时，您仍然可以点击它背后的网页。我尝试做类似的事情，但无法让它发挥作用。

即使在透明区域，我也无法点击它背后的页面。我也尝试过使用指针事件：无其他帖子中提到但没有帮助。它只会禁用iFrame中的元素，但不会影响它的点击次数。

有谁知道如何实现这一目标？有一种更大的iFrame的方法，其中的内容可以最小化，你仍然可以点击iFrame背后的内容？

更新使用框架时似乎无法做到这一点。

Answer 1

您是否尝试过指针事件：无？

Answer 2

策略1：iFrame Resizer

如果您能够将脚本同时放入主机页面和iFrame中包含的页面，则可以使用Bradshaw的iFrame Resizer JS。

它会动态调整iFrame的大小以适应其内容。跨域工作。

它的用例包括：

我无法判断您的用例是否符合这些标准。

策略2：重叠iFrame

使用JQuery，您可以切换完全或部分重叠的2（或n）个iFrame的可见性。您可以使用相同的内容或不同的内容加载每个iFrame。当任何iFrame不可见时，您可以点击它到其背后的内容，无论是另一个iFrame，还是其他任何内容。

在您的应用程序中，您将以不同的方式调整2个iFrame：iFrame1 =＆＃34;完整尺寸＆＃34;，iFrame2 =＆＃34;最小化。＆＃34;

在我的应用程序（下面）中，2个iFrame大多重叠并且具有相同的内容，但我填写它们的方式不同并稍微改变它们的位置，具体取决于页面上是否存在其他内容。我还使用iFrame Resizer动态调整两个iFrame的大小以适应其内容（上图），但您的应用可能不需要这样做。

我建议您为iFrames使用不同的边框颜色（下图），同时调整其位置和大小。

我在5分钟前才学会了JS，所以，如果我误解了你的问题，我很抱歉。

pos

Answer 3

我想你错过了：

myDiv.style.opacity = "0";
myDiv.style.filter  = "alpha(opacity=0)"; /* For IE8 and earlier */

顺便说一下，使用CSS类而不是通过JS应用CSS。让我知道它是怎么回事。