Bom dia,
Vocês tem como me passar um exemplo de eu faço um botão que dispara o evento F11 do teclado (deixar a tela cheia (full screen))?
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Bom dia,
Vocês tem como me passar um exemplo de eu faço um botão que dispara o evento F11 do teclado (deixar a tela cheia (full screen))?
Oi Maria, tudo bem?
Infelizmente, não é possível disparar o evento de pressionar a tecla F11 do teclado diretamente por meio de JavaScript devido a restrições de segurança. Isso ocorre porque a maioria dos navegadores bloqueia a capacidade de simular eventos de teclado que não foram acionados pelo usuário.
No entanto, você pode solicitar que o navegador entre no modo de tela cheia usando a API Fullscreen disponível nos navegadores modernos. Aqui está um exemplo de como criar um botão que entra em modo de tela cheia quando clicado:
<button id="fullscreenButton">Entrar em Tela Cheia</button>
const fullscreenButton = document.getElementById('fullscreenButton');
fullscreenButton.addEventListener('click', () => {
const element = document.documentElement; // Elemento raiz (por exemplo, <html>) do documento
if (element.requestFullscreen) {
element.requestFullscreen();
} else if (element.mozRequestFullScreen) { // Para o Firefox
element.mozRequestFullScreen();
} else if (element.webkitRequestFullscreen) { // Para o Chrome, Safari e Opera
element.webkitRequestFullscreen();
} else if (element.msRequestFullscreen) { // Para o Internet Explorer e Edge
element.msRequestFullscreen();
}
});
Neste exemplo, adicionamos um evento de clique ao botão "Entrar em Tela Cheia". Quando o botão é clicado, verificamos a disponibilidade do método requestFullscreen nas diferentes implementações dos navegadores e solicitamos o modo de tela cheia no elemento raiz do documento.
No entanto, observe que a entrada em tela cheia só será bem-sucedida se for desencadeada por uma ação do usuário, como um clique. Isso é feito para evitar abusos e garantir a segurança e a privacidade do usuário.
Você pode ver aqui o código que fiz para teste.
Um abraço e bons estudos.