En este post les voy a hablar de la api HTML5 fullscreen. durante años solamente las aplicaciones creadas en flash o en java eran las únicas que tenían el poder de poder entrar en modo pantalla completa. A partir de ahora nuestras aplicaciones echas en HTML5 y javascript podrán tener esta habilidad también.
Métodos de HTML5 Fullscreen
element.requestFullScreen: Con este método se hace que un elemento independiente entre en modo pantalla completa.
document.cancelFullScreen(): Cancela cualquier elemento que se encuentre en pantalla completa.
document.fullScreen: Retorna verdadero si hay algun elemento en pantalla completa.
:full-screen: Le da un estilo al elemento cuando esta en modo de pantalla completa.
Actualmente hay ciertas resistencias de los creadores de los navegadores en darle completo soporte a esta api, por una cuestión de seguridad, ya que como la aplicación va a tener la posibilidad de usar la pantalla completa, se podría emular completamente el sistema operativo y de esta manera sacarle la contraseña a la persona o algo por el estilo. Hasta ahora los navegadores que soportan esta api son: Chrome 16+, Firefox 10+ y Safari.
Para poder usarlo en los diferentes navegadores hay que ponerle el prefijo de cada navegador.
GIT: https://github.com/bomba1990/HTML5-Ejemplos/blob/master/fullscreen/fullscreen.html
document.fullScreen: Retorna verdadero si hay algun elemento en pantalla completa.
:full-screen: Le da un estilo al elemento cuando esta en modo de pantalla completa.
Soporte de HTML5 Fullscreen
Actualmente hay ciertas resistencias de los creadores de los navegadores en darle completo soporte a esta api, por una cuestión de seguridad, ya que como la aplicación va a tener la posibilidad de usar la pantalla completa, se podría emular completamente el sistema operativo y de esta manera sacarle la contraseña a la persona o algo por el estilo. Hasta ahora los navegadores que soportan esta api son: Chrome 16+, Firefox 10+ y Safari.
Para poder usarlo en los diferentes navegadores hay que ponerle el prefijo de cada navegador.
Poniendo en practica el modo pantalla completa.
Para usar o activar el modo de pantalla completa les dejo aquí una función muy útil que trabaja con todos los tipos de prefijos, no fue creada por mi sino por el autor de este articulo: html5 full screen. Pero de todas maneras aquí les dejo un ejemplo HTML5 fullscreen.GIT: https://github.com/bomba1990/HTML5-Ejemplos/blob/master/fullscreen/fullscreen.html