Chrome 43 window size bug after full screen

1.1k Views Asked by At

I am facing a strange bug on Chrome 43, with this steps: - I open a page, let say page1.html, and I go to fullscreen with html5 (with a button click)

  • I resize the browser window in this page1.html

  • Then I click a link on this pages, that opens another page, let say page2.html

  • The browser close the fullscreen automatically, and redirect to page2.html

  • In the page2.html the document.documentElement.offsetWidth/clientWidth is different from the window.innerWidth.

  • The html and body tag are set 100% width and 100% height on page2.html.

If I trigger a full screen mode in page2.html, and the exits from it, it seems to fix this issue

If I open page2.html normally in a new window document.documentElement.offsetWidth/clientWidth is equal to the window.innerWidth.

This is happening only in the last Chrome. Anyone have idea what is going wrong?

Why a trigger of fullscreen seems to fix the problem, what does the fullscreen mode trigger inside the browser?

Code to simulate this bug page1.html:

<html>
    <head>
    </head>
    <body style="background-color: red">
        <span onclick="fullmode();">CLICK HERE FOR FULL SCREEN MODE</span>
        <a href="http://stackoverflow.com/">GO TO TO PAGE2.html </a>
        <script>
            function fullmode() {
                if (!document.fullscreenElement &&    // alternative standard method
                    !document.mozFullScreenElement && !document.webkitFullscreenElement && !document.msFullscreenElement ) {  // current working methods
                    if (document.documentElement.requestFullscreen) {
                        document.documentElement.requestFullscreen();
                    } else if (document.documentElement.msRequestFullscreen) {
                        document.documentElement.msRequestFullscreen();
                    } else if (document.documentElement.mozRequestFullScreen) {
                        document.documentElement.mozRequestFullScreen();
                    } else if (document.documentElement.webkitRequestFullscreen) {
                        document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
                    }
                } else {
                    if (document.exitFullscreen) {
                        document.exitFullscreen();
                    } else if (document.msExitFullscreen) {
                        document.msExitFullscreen();
                    } else if (document.mozCancelFullScreen) {
                        document.mozCancelFullScreen();
                    } else if (document.webkitExitFullscreen) {
                        document.webkitExitFullscreen();
                    }
                }
            } 
        </script>
    </body>
</html>
0

There are 0 best solutions below