How to change full screen background color in safari

Question

I used this JavaScript code to full screen the page:

<script>
    function requestFullScreen(element) {
        // 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}");
            }
        }
    }

</script>

And then changed the full screen page background color:

html:-moz-full-screen {
background: red;
}

html:-webkit-full-screen {
background: red;
}

html:-ms-fullscreen {
background: red;
width: 100%; /* needed to center contents in IE */
}

html:fullscreen {
background: red;
}

but it doesn't work in safari.

How can I change full screen background color in safari?

Answer 1

why not just use this in your css:

html{
     background-color: #ff0000;
}

if it's not working you may have other issues and it would be good too see your full html and css.

otherwise you may try this: http://johndyer.name/native-fullscreen-javascript-api-plus-jquery-plugin/