Here's documentation on exiting fullscreen mode.

I used this code that I learnd to make the browser go fullscreen (it works), but my attempts to modify a version of it to exit fullscreen failed. Dealing with these non-standard APIs is a little tricky, with each browser implementing it a bit differently.

Here's the code:

// Bring the page into full-screen mode - Works!
function requestFullScreen(element) {

    // Supports most browsers and their versions.
    var requestMethod = element.requestFullScreen || 
        element.webkitRequestFullScreen           || 
        element.mozRequestFullScreen              || 
        element.msRequestFullScreen;
    if (requestMethod) {
        requestMethod.call(element);
    } else if ( typeof window.ActiveXObject !== "undefined") {
        var wscript = new ActiveXObject("WScript.Shell");
        if (wscript !== null) {
            wscript.SendKeys("{F11}");
        }
    }
}

// Exit fullscreen - Doesn't work!
function exitFullScreen(element){
    var requestMethod = element.exitFullscreen || 
        element.mozCancelFullScreen            || 
        element.webkitExitFullscreen           || 
        element.msExitFullscreen;
    if (requestMethod) {
        requestMethod();
    } else {
        console.log("Oops. Request method false.");
    }
}

And the calls:

var $fullscreenButton = $("#fullscreen-button");
var $smallscreenButton = $("#smallscreen-button");

$fullscreenButton.on("click", function() {
    var elem = document.body;

    // Make the body go full screen.
    requestFullScreen(elem);
});

$smallscreenButton.on("click", function() {
    var elem = document.body;

    // Exit full screen.
    exitFullScreen(elem);
});

What's wrong with the exitFullScreen function? How can I fix it?

Edit:

• I'm working on a JSFiddle for this!
• By "Doesn't work", I meant that it outputs "Oops. Request method false."
• I'm calling the function exitFullScreen() with the parameter document.body

JSFiddle:

While the full screen request function works for me in the browser normally, I could not get it to work in JSFiddle, and I'm unsure whether this is because of my own mistake, or something to do with JSFiddle.

Here's documentation on exiting fullscreen mode.

I used this code that I learnd to make the browser go fullscreen (it works), but my attempts to modify a version of it to exit fullscreen failed. Dealing with these non-standard APIs is a little tricky, with each browser implementing it a bit differently.

Here's the code:

// Bring the page into full-screen mode - Works!
function requestFullScreen(element) {

    // Supports most browsers and their versions.
    var requestMethod = element.requestFullScreen || 
        element.webkitRequestFullScreen           || 
        element.mozRequestFullScreen              || 
        element.msRequestFullScreen;
    if (requestMethod) {
        requestMethod.call(element);
    } else if ( typeof window.ActiveXObject !== "undefined") {
        var wscript = new ActiveXObject("WScript.Shell");
        if (wscript !== null) {
            wscript.SendKeys("{F11}");
        }
    }
}

// Exit fullscreen - Doesn't work!
function exitFullScreen(element){
    var requestMethod = element.exitFullscreen || 
        element.mozCancelFullScreen            || 
        element.webkitExitFullscreen           || 
        element.msExitFullscreen;
    if (requestMethod) {
        requestMethod();
    } else {
        console.log("Oops. Request method false.");
    }
}

And the calls:

var $fullscreenButton = $("#fullscreen-button");
var $smallscreenButton = $("#smallscreen-button");

$fullscreenButton.on("click", function() {
    var elem = document.body;

    // Make the body go full screen.
    requestFullScreen(elem);
});

$smallscreenButton.on("click", function() {
    var elem = document.body;

    // Exit full screen.
    exitFullScreen(elem);
});

What's wrong with the exitFullScreen function? How can I fix it?

Edit:

• I'm working on a JSFiddle for this!
• By "Doesn't work", I meant that it outputs "Oops. Request method false."
• I'm calling the function exitFullScreen() with the parameter document.body

JSFiddle:

While the full screen request function works for me in the browser normally, I could not get it to work in JSFiddle, and I'm unsure whether this is because of my own mistake, or something to do with JSFiddle.

• javascript
• browser
• fullscreen

• 2 Perhaps ment as to why the downvote? It's nearly impossible to ask a question on Stackoverflow these days, with everyone here down-voting like crazy, not suggesting improvements, and just attacking any question that isn't perfect, or generalized, or... whatever you people are looking for here these days. On other Stack Exchange munities, so many questions get up-votes and good feedback. Here, it's like the whole system has gone to hell. So many people respond negatively.. Just my observation :) – WebDeveloper404 Commented Aug 4, 2014 at 0:01
• 2 @MatthewLock No, you're mistaken. Working examples are for Code Review.SE - Stack Overflow is for code that doesn't work. This code is easily verifiable, has been simplified to my precise problem, and is pletely straight-forward. – WebDeveloper404 Commented Aug 4, 2014 at 0:21
• 2 Are you getting errors in the console? What browser(s) are you having the issue? I believe what @MatthewLock is reaching for is sscce, which this is not. It's not required (AFAIK) but it certainly helps; users can downvote for whatever reason they want, so they aren't tied together. I also wouldn't get too worked into a lather by downvotes, it's just wasted effort. – Jared Farrish Commented Aug 4, 2014 at 0:32
• 2 @WebDeveloper404, "doesn't work" is not very helpful.. what does not work ? do you get errors ? do you get you own ˋconsole.logˋ message ? how are you calling those methods ? what arguments are you passing ? Which browsers exhibit the problem ? Each of those issues could be a reason for failure.. – Gabriele Petrioli Commented Aug 4, 2014 at 0:40
• 2 @GabyakaG.Petrioli I've added these details into the question. Thanks for the suggested improvements! – WebDeveloper404 Commented Aug 4, 2014 at 0:46

1 Answer 1

For entering the fullscreen there were some issues with the capitalization.

For the exiting you need to call it on the document and not on the body, and you also need to apply it correctly instead of calling the reference to the method..

so requestMethod.call(element); for exiting as well.

See demo at http://jsfiddle/gaby/FGX72/show
(tested on latest IE/Chrome/FireFox)