Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

[Dúvida] fullscreen depois do refresh

Bom dia!

Como faço para manter uma imagem em fullscreen mesmo depois do refresh utilizando JS?

Grato.

1 resposta
solução!

Olá Caio,

Para manter uma imagem em fullscreen mesmo depois do refresh utilizando JS, você pode utilizar o método requestFullscreen() do objeto document.documentElement. Esse método permite que você coloque o elemento em tela cheia.

Para manter a imagem em tela cheia após o refresh, você pode armazenar em um cookie ou no localStorage do navegador o estado da imagem em tela cheia. Depois, ao carregar a página novamente, você pode verificar se o estado da imagem estava em tela cheia e, se sim, chamar o método requestFullscreen() novamente.

Aqui está um exemplo de código que pode ajudá-lo:

const img = document.getElementById('minha-imagem');

if (localStorage.getItem('fullscreen')) {
  img.requestFullscreen();
}

function toggleFullscreen() {
  if (document.fullscreenElement) {
    localStorage.setItem('fullscreen', true);
  } else {
    localStorage.removeItem('fullscreen');
  }
}

img.addEventListener('click', toggleFullscreen);

Nesse exemplo, a imagem é colocada em tela cheia quando o usuário clica nela. Se o usuário atualizar a página enquanto a imagem estiver em tela cheia, o código verifica se o estado da imagem estava em tela cheia e, se sim, chama o método requestFullscreen() novamente.

Espero ter ajudado e bons estudos!