如何激活全屏模式？

我試圖激活全屏模式使用Javascript，但它不工作。如何激活全屏模式？

請注意，功能（行4和11）內的控制檯日誌正在打印正確的值，但全屏模式未顯示。

可能是什麼問題？這是我的代碼。

function fullscreen() 
{ 
    var _element = document.getElementById('BookMainDiv'); 
    console.log(_element); 
    if (_element.mozRequestFullScreen) 
    { 
     _element.mozRequestFullScreen(); 
    } 
    else if(_element.webkitRequestFullScreen) 
    { 
     console.log("aaa"); 
     _element.webkitRequestFullScreen(); 
    } 
}

HTML

<body> 
<div id="BookMainDiv" style="width:500px;height:500px;background-color:yellow"> 
</div> 
<input type="button" style="height:20%;width:20%" onclick="fullscreen()"> 
</body>

附：我在Windows 8上使用chrome 31

來源

2013-12-09 Aditya Ponkshe

如何調用'fullscreen'？ –

_element.webkitRequestFullScreen（）; –

我的意思是，你從控制檯嘗試？（它不會工作，你需要頁面啓動它，與原點有關） –

這應該工作..

<html> 
    <head> 
    <script> 
     function fullscreen() 
     { 
     var fullscrn = document.getElementById("BookMainDiv"); 
     req= fullscrn.requestFullScreen || fullscrn.webkitRequestFullScreen || fullscrn.mozRequestFullScreen; 
     req.call(fullscrn); 


     } 
    </script> 
    </head> 
    <body> 
    <div id="BookMainDiv" style="width:500px;height:500px;background-color:yellow"> 
    </div> 
    <input type="button" style="height:20%;width:20%" onclick="fullscreen()"> 
    </body> 

</html>

P.S：您的代碼在我的系統中工作正常（是的，瀏覽器本身是Chrome）

來源

2013-12-09 13:46:59

抱歉不能測試你的代碼atm，我會明天早上測試它，印度時間會在那之後做出迴應 –

發生在開發工具打開並且在JavaScript中有斷點時，發生requesFullScreen（webkitRequestFullScreen）在Chrome中不起作用！關閉它，你會看到它會工作！

----------------------------- EDITED ---------------- -

要確保您的文檔聲明是這樣的一個：

<!DOCTYPE html>

而且試試這個代碼：

function FullScreen() { 
    var element = document.getElementById("BookMainDiv"); 
    if (element.requestFullScreen) { 
     element.requestFullScreen(); 
    } 
    if (element.webkitRequestFullScreen) { 
     element.webkitRequestFullScreen(); 
    } 
    if (element.mozRequestFullScreen) { 
     element.mozRequestFullScreen(); 
    } 
}

來源

2013-12-09 13:42:16 sabotero

沒有斷點，開發人員工具沒有打開 –

好吧，所以真的很奇怪。如果你打開你的開發工具，你是否在控制檯中有錯誤？ – sabotero

如何激活全屏模式？

回答

相關問題