Geek asks and answers

Safari iOS6 full screen detection

I would like to use the new full screen Safari feature in iOS6. Now I know that it is impossible to run a full-screen function from javascript, and that’s good, but I would like to know when the user enters full-screen mode. (To display a pop-up window with the text, “This site is best viewed in full screen” until the user enters full screen.)

I tried setting the window, the document and the wrapper div (with the width and height set to 100% in css) of the onresize events (through regular javascript and through the jQuery "resize" event), but they do not fire when I go into full screen mode .

I also set the interval to check for a change in the width and height of the screen / document / wrapper file, but they did not display any changes.

Is there any other way to determine how a user has entered (or exited) full-screen mode?

+5
source share
1 answer

Well, I really don't know why this didn't work before, but I blame the new iOS Safari debugging console (which is now required to go through safari on your Mac) because it did not always show all the logs sent to the console.

However, when I simply added messages to the body of the html document itself, the WERE events worked. Binding a jQuery 'resize' event to a window seems to be the best option.

200, , - 320.

, , . ( , , iPhone (http://ajaxian.com/archives/iphone-windowonorientationchange-code)).

    $(window).on('resize', function(){
        if ($(this).height() > 300 && 
           (window.orientation == 90 || window.orientation == -90)) {
            // Full screen!
        } else {
            // Exit full screen!
        }
    });
0

More articles:


All Articles