CODEWITHSUNDEEP
javascriptjqueryhtmlgoogle-chromebrowser
user3050963
user3050963

Reputation: 275

Make google-chrome browser go fullscreen when page loads

Please consider answering this question here even if you mark it as a duplicate because for some reason I just can't get it to work with other solutions and though I tried to ask for help no one replied...

What I really want is to $(document).ready(function(){browser goes fullscreen}) but unfortunately it isn't working and I am desperate through trying to find a solution online because nothing appears to work! I have the js file well inserted in my main php file (console.log works) but it just won't load fullscreen no matter the lines of code...

If you can provide a solution to work in all browsers and with keys activated I would be really, really thankful. Otherwise I'll contempt myself with the google chrome answer. Thank you so much.

EDIT1:

I tried this

// mozilla proposal
element.requestFullScreen();
document.cancelFullScreen(); 

// Webkit (works in Safari and Chrome Canary)
element.webkitRequestFullScreen(); 
document.webkitCancelFullScreen(); 

// Firefox (works in nightly)
element.mozRequestFullScreen();
document.mozCancelFullScreen(); 

// W3C Proposal
element.requestFullscreen();
document.exitFullscreen();

The following one only under user interaction:

addEventListener("click", function() {
    var
          el = document.documentElement
        , rfs =
               el.requestFullScreen
            || el.webkitRequestFullScreen
            || el.mozRequestFullScreen
    ;
    rfs.call(el);
});

amongst others I can't find now and basically I have combined them with $(document).ready(function(){---}); but nothing happened.

Upvotes: 4

Views: 7123

Answers (1)

Dean Taylor
Dean Taylor

Reputation: 41991

The short answer is you can't.

I have tested using this code.

In Firefox is outputs this warning in the console - frankly I was expecting this kind of warning from all browsers, however it seems currently only Firefox implements this.

Request for full-screen was denied because Element.mozRequestFullScreen() was not called from inside a short running user-generated event handler.

As I stated in my comment:

For security reasons you might find that actions such as "full-screen" might only be available if they are enacted as a direct result of a user action i.e. "click"

Well it's true. Get the user to click something (or take some other user event) to make then call the full-screen functions.

Browsers Tested (navigator.userAgent):

  • Chrome 31: "5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/31.0.1650.63 Safari/537.36"
  • Firefox 25: "Mozilla/5.0 (Windows NT 6.1; WOW64; rv:25.0) Gecko/20100101 Firefox/25.0"
  • IE 11: "Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; .NET4.0E; InfoPath.3; rv:11.0) like Gecko"

Upvotes: 5

Related Questions