Detectando o redimensionamento da janela com JavaScript

Um dos problemas relativos em confiar nas dimensões do navegador no momento em que a página é carregada é a possibilidade de um redimensionamento por parte do usuário. Um exemplo disso são as animações que percorrem toda a largura da página, caso sejam redimensionadas de forma que aumente a largura, o usuário reparará que a animação foi mal projetada, com este script que mostrarei como exemplo, você poderá tomar as devidas providências em seu website.

Começe abrindo o seu editor de texto favorito e crie uma página html com o seguinte código:

  1. <head>
  2.     <title>Detectando o redimensionamento da janela</title>
  3. </head>
  4. <body>
  5. <p>Redimensione esta janela</p>
  6.     <script language=”javascript”>
  7.         function aviso() {
  8.             alert(“A janela foi redimensionada!”);
  9.         }
  10.         // Evento responsável por monitorar o evento de redimensionamento
  11.         window.onresize = aviso;
  12.     </script>
  13. </body>
  14. </html>

Toda vez que a janela do navegador do cliente for redimensionada, é disparado o evento resize, que neste script  dispara a função aviso(), que por sua vez exibe um alerta para o usuário dizendo que a janela foi redimensionada.

Até a próxima.

Anúncios

Deixe um comentário

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logotipo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair / Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair / Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair / Alterar )

Foto do Google+

Você está comentando utilizando sua conta Google+. Sair / Alterar )

Conectando a %s