Amanda, parte de nuestro staff, nos ha hecho el favor de redactar esta sección porque domina muy bien el tema.
Solución:
Esto ahora es posible en las últimas versiones de Chrome, Firefox e IE(11).
Siguiendo los consejos de Zuul en este hilo, edité su código para incluir IE11 y la opción de mostrar en pantalla completa cualquier elemento de su elección en su página.
JS:
function toggleFullScreen(elem) {
// ## The below if statement seems to work better ## if ((document.fullScreenElement && document.fullScreenElement !== null) || (document.msfullscreenElement && document.msfullscreenElement !== null) || (!document.mozFullScreen && !document.webkitIsFullScreen)) (document.mozFullScreen !== undefined && !document.mozFullScreen)
HTML:
Donde “document.body” es cualquier elemento que desee.
También tenga en cuenta que intentar ejecutar estos comandos de pantalla completa desde la consola no parece funcionar en Chrome o IE. Sin embargo, tuve éxito con Firebug en Firefox.
Otra cosa a tener en cuenta es que estos comandos de “pantalla completa” no tienen una barra de desplazamiento vertical, debe especificar esto dentro del CSS:
*:fullscreen
*:-ms-fullscreen,
*:-webkit-full-screen,
*:-moz-full-screen
overflow: auto !important;
El “! importante” parece ser necesario para que IE lo represente
Aquí hay un ejemplo de cómo funciona.
No. Las versiones anteriores de IE (≤6) lo permitían, pero esta funcionalidad se considera un problema de seguridad, por lo que ningún navegador moderno lo permite.
todavía puedes llamar window.open(url,'','fullscreen=yes')que te lleva al 90% del camino, pero tiene resultados ligeramente diferentes:
- IE abre una ventana con solo la barra de título y la barra de URL. El tamaño de la ventana ocupa toda la pantalla y cubre la barra de tareas de Windows.
- Mozilla también abre una ventana con solo la barra de título y la barra de URL. Sin embargo, la nueva ventana hereda las dimensiones de la ventana que se abre. Si la ventana de apertura está maximizada, la nueva ventana se abre maximizada. (La barra de tareas no está cubierta).
- Chrome también abre una ventana con solo la barra de título y la barra de URL. La nueva ventana hereda las dimensiones de la ventana que se abre, pero es nunca abierto maximizado (incluso si la ventana de apertura está maximizada).
Esto es lo más cerca que obtendrá con JavaScript. Su otra opción sería construir algo en Flash (¡puaj!)o simplemente haga que su botón “pantalla completa” muestre un cuadro de luz que diga “Presione F11 para ir a pantalla completa” y oculte el cuadro de luz en window.resize o haciendo clic en un botón de cancelar en la caja de luz.
Editar: Webkit (Safari 5.1+/Chrome 15+) y Firefox (10+) han implementado una API de pantalla completa adecuada (propuesta primero por Mozilla y luego lanzada como propuesta del W3C). Una breve historia y ejemplos de uso aquí. Tenga en cuenta que IE10 supuestamente no apoyar la API.
Me pregunto por qué nadie se dio cuenta de que todas las respuestas son incorrectas.
Establecer el elemento del cuerpo en pantalla completa no no tienen el mismo comportamiento de presionar F11.
El mismo comportamiento de F11 se puede obtener por:
document.documentElement.requestFullScreen(); // on
y
document.cancelFullScreen(); // off
también para comprobar si estamos en modo pantalla completa utilizo esta línea:
isFullScreen=()=>!(document.currentFullScreenElement==null)
esto también detecta si F11 invocó a pantalla completa:
isFullScreen=(document.documentElement.clientWidth==screen.width && document.documentElement.clientHeight==screen.height)
Nota:
esto debe llamarse desde dentro de un evento de interacción del usuario (onclick, onkeydown, etc.).
Nota 2: cuando el usuario presiona F11, ningún “elemento” está realmente configurado en pantalla completa, por lo que la única forma de detectarlo es interceptar el teclado con un detector de eventos o verificar si las dimensiones del cliente son las mismas que las dimensiones de la pantalla **
Te invitamos a proteger nuestro quehacer exponiendo un comentario y dejando una valoración te damos la bienvenida.