Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
434 views
in Technique[技术] by (71.8m points)

javascript - 以全屏模式打开网址(Open a url in full screen mode)

I am trying to open a URl in full screen on click of a button, am using the following code.

(我正在尝试通过单击按钮全屏打开URl,正在使用以下代码。)

The window does open full screen but then on the URL reload just goes back to the orignal screen size,

(该窗口确实会全屏打开,但是在重新加载网址后,它又回到了原始屏幕尺寸,)

<script type="text/javascript">

function toggleFullScreen() 
{
    if ((document.fullScreenElement && document.fullScreenElement !== null) || (!document.mozFullScreen && !document.webkitIsFullScreen)) 
    {
        if (document.documentElement.requestFullScreen) {  
          document.documentElement.requestFullScreen();  
        } else if (document.documentElement.mozRequestFullScreen) {  
            document.documentElement.mozRequestFullScreen();  
        } else if (document.documentElement.webkitRequestFullScreen) {  
            document.documentElement.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);  
        }  
    } 
    else 
    {  
        if (document.cancelFullScreen) {  
            document.cancelFullScreen();  
        } else if (document.mozCancelFullScreen) {  
            document.mozCancelFullScreen();  
        } else if (document.webkitCancelFullScreen) {  
            document.webkitCancelFullScreen();  
        }    
    }  
    window.location.href = "http://google.com/";    
}



</script>

<input type="button" value="click to toggle fullscreen" onclick="toggleFullScreen();">

I have even tried open page from the same domain, even that doesn't seem to work.

(我什至尝试从同一域打开页面,即使这样似乎也不起作用。)

  ask by Cool Techie translate from so

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

First, I recommend using "screenfull" to avoid the boilerplate JavaScript you have: https://github.com/sindresorhus/screenfull.js/

(首先,我建议使用“ screenfull”来避免使用样板JavaScript: https//github.com/sindresorhus/screenfull.js/)

It will expose itself on the window object so it is as easy as this:

(它将自身暴露在window对象上,因此非常简单:)

if (screenfull.enabled) {
    screenfull.request();
}

Second, As far as I know, you can't fix this.

(第二,据我所知,您无法解决此问题。)

The browser requests permission from the user to open specifically that page in full screen and as you've said, that does work.

(浏览器请求用户许可以全屏方式专门打开该页面 ,正如您所说的,这确实可行。)

When you use window.location you "navigate away" from that page and the full screen permission attached to it.

(当您使用window.location您将“导航”离开该页面并附加了全屏权限。)


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...