Poner navegador en pantalla completa con jQuery

En este tutorial aprenderemos cómo hacer que el navegador cambie al modo de pantalla completa mediante jQuery.

Usaremos dos funciones para cambiar el navegador a pantalla completa y viceversa, utilizando un método diferente dependiendo del navegador que estemos usando.

Función Pantalla completa

La primera función pondrá el navegador en pantalla completa con la funcion requestFullScreen()

function pantallaCompleta(elem) {
    //Si el navegador es Mozilla Firefox 
    if(elem.mozRequestFullScreen) {
        elem.mozRequestFullScreen(); 
    }
    //Si el navegador es Google Chrome
    else if(elem.webkitRequestFullScreen) {
        elem.webkitRequestFullScreen();
    }
    //Si el navegador es otro else
    if(elem.requestFullScreen) {
        elem.requestFullScreen();
    }
}

Quitar pantalla completa

Con la función CancelFullScreen el navegador saldrá del modo de pantalla completa.

function pantallaNormal() {
    //Mozilla Firefox
    if(document.mozCancelFullScreen) {
        document.mozCancelFullScreen();
    }
    //Google Chrome
    else if(document.webkitCancelFullScreen) {
        document.webkitCancelFullScreen();
    }
    //Otro
    else if(document.cancelFullScreen) {
        document.cancelFullScreen();
    }
}

Más tutoriales de jQuery

Si te ha gustado no olvides compartir en redes sociales.

[addthis tool=»addthis_inline_share_toolbox_6jt6″]

Espero que te haya servido. Cualquier duda deja un comentario. Un saludo