How to make the window full screen with Javascript (stretching all over the screen)

后端 未结 19 1838
天涯浪人
天涯浪人 2020-11-21 22:13

How can I make a visitor\'s browser go fullscreen using JavaScript, in a way that works with IE, Firefox and Opera?

19条回答
  •  后悔当初
    2020-11-21 22:36

    Here is my full solution for Full Screen and Exit Full Screen both (many thanks to help from tower's answer above):

    $(document).ready(function(){
    $.is_fs = false;
    $.requestFullScreen = function(calr)
    {
        var element = document.body;
    
        // Supports most browsers and their versions.
        var requestMethod = element.requestFullScreen || element.webkitRequestFullScreen || element.mozRequestFullScreen || element.msRequestFullScreen;
    
        if (requestMethod) { // Native full screen.
            requestMethod.call(element);
        } else if (typeof window.ActiveXObject !== "undefined") { // Older IE.
            var wscript = new ActiveXObject("WScript.Shell");
            if (wscript !== null) {
                wscript.SendKeys("{F11}");
            }
        }
    
        $.is_fs = true;    
        $(calr).val('Exit Full Screen');
    }
    
    $.cancel_fs = function(calr)
    {
        var element = document; //and NOT document.body!!
        var requestMethod = element.exitFullScreen || element.mozCancelFullScreen || element.webkitExitFullScreen || element.mozExitFullScreen || element.msExitFullScreen || element.webkitCancelFullScreen;
    
        if (requestMethod) { // Native full screen.
        requestMethod.call(element);
        } else if (typeof window.ActiveXObject !== "undefined") { // Older IE.
            var wscript = new ActiveXObject("WScript.Shell");
            if (wscript !== null) {
                wscript.SendKeys("{F11}");
            }
        }    
    
        $(calr).val('Full Screen');    
        $.is_fs = false;
    }
    
    $.toggleFS = function(calr)
    {    
        $.is_fs == true? $.cancel_fs(calr):$.requestFullScreen(calr);
    }
    
    });
    

    // CALLING:

    
    

提交回复
热议问题