pantalla completa API HTML5 y Safari (IOS 6)

Question

que estoy tratando de hacer que una aplicación se ejecute en modo de pantalla completa (sin la barra superior) en Safari para iOS 6. El código es el siguiente:

var elem = document.getElementById("element_id"); 
if (elem.requestFullScreen) { 
    elem.requestFullScreen(); 
} else if (elem.mozRequestFullScreen) { 
    elem.mozRequestFullScreen(); 
} else if (elem.webkitRequestFullScreen) { 
    elem.webkitRequestFullScreen(); 
} 

Funciona bien en los navegadores de escritorio. Pero en Mobile Safari (iOS) 6 no funciona.

¿Alguna idea de este problema?

Answer 1

No es compatible ...

http://caniuse.com/fullscreen

Answer 2

no puede utilizar la pantalla completa. Si configura las metaetiquetas correctamente y pone la aplicación web en la pantalla de inicio, puede deshacerse de todo el safari cruft, pero aún le queda la barra de estado de iOS (conectividad, reloj, batería).

<meta name="apple-mobile-web-app-capable" 
    content="yes" /> 
<meta name="apple-mobile-web-app-status-bar-style" 
    content="black-translucent" /> 

Hay una serie de recursos para esto, aquí es el que yo he estado usando:

http://matt.might.net/articles/how-to-native-iphone-ipad-apps-in-javascript/

propia documentación de Apple es bueno también:

http://developer.apple.com/library/safari/#documentation/AppleApplications/Reference/SafariHTMLRef/Articles/MetaTags.html

Pero, en resumen, no puede, a partir de iOS 6.1, implementar una aplicación web a pantalla completa en dispositivos con iOS. La barra de estado siempre estará presente.

Answer 3

Lo siguiente desplaza la barra de estado en iOS fuera del camino. Llame a primera hora de sus $ (document) .ready

$('body').scrollTop(1); 

Esto funciona hasta la versión 6.x en el momento pero no parece funcionar en la versión beta del navegador del iOS7. Como siempre, la barra de herramientas del navegador en la parte inferior es fija.

Answer 4

https://developer.apple.com/reference/webkitjs/htmlvideoelement

if (elem.webkitEnterFullScreen) { 
    elem.webkitEnterFullScreen(); 
} 

funciona para mí.