使用iframe和页面覆盖动态

我已经添加了以下iFrame的页面使用iframe和页面覆盖动态

<iframe src='http://redbug.redrocksoftware.com.au:80/Pages/chamara.html' style="position:absolute;z-index:1;" ></iframe>

chamara.html页面包含一个按钮，当我点击该按钮，我需要在当前页面过于掩饰。

反馈是内部的iframe按钮： enter image description here

当我点击它，我需要像下面的情况发生。

enter image description here

我试图用IFRAME绝对定位和z-index的，但不能得到任何工作还没有。

2015-04-05 chamara

是否iframe要覆盖所有的页面？按钮覆盖是否覆盖了所有的iframe？ – 2015-04-05 05:11:00

@RafaelAlmeida号这只是一个iframe添加到另一个页面内，我需要它来动态覆盖整个页面 – chamara 2015-04-05 05:13:42

默认覆盖整个页面，或仅当反馈按钮被触发时覆盖整个页面？默认情况下，尝试它：'iframe {position：absolute;顶部：0;左：0;宽度：100％;高度：100％;的z-index：999; }' – 2015-04-05 05:15:49

哈哈，终于完成了演示！：P

好吧，我们走吧。如果你需要iframe覆盖整个页面，只有当他的按钮被触发时，你可以使用jQuery来处理click事件。您需要使用contents()获取iframe内容，然后使用find()获取所需的元素。基本上这样的：

$("#iframe").contents().find("#iframe_button").click(function() { 
    // Button fired! 
})

要的iframe覆盖我写这个CSS类的所有页面：

.iframe_cover { 
    position:absolute; 
    top:0; 
    left:0; 
    width:100% !important; 
    height:100% !important; 
    border:0; 
}

所以，当按钮被触发时，iframe将这个类。看：

$("#iframe").contents().find("#iframe_button").click(function() { 
    $("#iframe").addClass("iframe_cover"); 
})

2015-04-05 05:54:32

谢谢你的帮助朋友。 – chamara 2015-04-05 06:05:11

不客气:) – 2015-04-05 06:05:40

回答