iframe中的元素如何请求全屏？

Question

单独打开页面可以正常触发全屏:

<iframe id="iframe_index" name="iframe_a" src="" style="height: 468px;">
<a class='button_top' id='fullscreen' align='center' style='text-decoration:none;'>全屏</a>
</iframe>   

$("#fullscreen").click(function(){
    var elem = document.getElementById("container");
    requestFullScreen(elem);
});
function requestFullScreen(element) {
    var requestMethod = element.requestFullScreen || element.webkitRequestFullScreen || element.mozRequestFullScreen || element.msRequestFullScreen;
    console.log(requestMethod);
    if (requestMethod) {
        requestMethod.call(element);
    } else if (typeof window.ActiveXObject !== "undefined") {
        var wscript = new ActiveXObject("WScript.Shell");
        if (wscript !== null) {
            wscript.SendKeys("{F11}");
        }
    }
}

但是，我现在的需求是element的外层是iframe，这样一来全屏的请求无法触发了。

求高手解惑。

Answer 1

在iframe标签里面加上 allowFullScreen 这一句试试

Answer 2

同求答案啊 搞了半天了 最后只能在子级页面 调用父级iframe进入全屏 但是处理起来很麻烦 有没有大神给更好的方案

Answer 3

在iframe增加allowfullscreen是生效的