Como ajustar o tamanho do iframe pelo tamanho da tela e mudar o target de uma página depois dela aberta

Publicado por Perfil removido em 10/03/2010

[ Hits: 36.349 ]

 


Como ajustar o tamanho do iframe pelo tamanho da tela e mudar o target de uma página depois dela aberta



No processo de reformulação do meu site eu descobri funções muito legais do JavaScript que realmente fizeram tudo o que eu queria.

No primeiro caso eu coloquei um iframe num espaço da tela e queria que ele preenchesse todo o espaço vazio que estava sobrando proporcional ao tamanho da tela. Como? A gente descobre o tamanho da tela, desconta a área que já foi preenchida e redimensiona o iframe pro tamanho restante. Fazemos isso no onload da página e no onresize (esse por JavaScript pra obedecer as regras do HTML 4.01 e ser compatível com todos os navegadores). Nesse exemplo vamos redimensionar a altura.

<script language="JavaScript" type="text/javascript">
  window.onresize = AjustarIFrame;

  function AjustarIFrame()
  {
    //Identifica navegador
    var TamanhoTopo;
    TamanhoTopo = 113;

    if (navigator.appName.indexOf("Microsoft") != -1)
    {
      document.getElementById('meuiframe').height = document.documentElement.clientHeight - TamanhoTopo;
    }
    else
    {
      document.getElementById('meuiframe').height = window.innerHeight - TamanhoTopo;
    }
  }
</script>

Esse script fica no head e chamamos ele ao carregar a página.

<body onload="JavaScript:AjustarIFrame();">

E esse é o nosso iframe que será redimensionado. Foi o que eu fiz no meu site em http://pedro-araujo.com/blog.

<iframe id="meuiframe" height="0" src="minhaurl" frameborder="0" width="100%" scrolling="auto"></iframe>

Por fim, algo que pode ser associado a isso é mudar o target da página depois que ela já foi aberta. Um exemplo: alguém chama o seu site dentro de um iframe na página dele, mas você não quer que seu site apareça 'encaixotado', então você força ela a ocupar toda a janela do navegador no onload, ou seja, ele não vai ficar 'preso' no iframe e vai automaticamente abrir na área de navegação principal, ela nunca vai ser filha de uma outra janela, sempre vai forçar a ter o target como parent. Eis o JavaScript:

if(window.top != window.self) window.open(document.location, '_parent');

Um exemplo disso é a tela de login do Twitter (http://twitter.com/login) - tente 'prendê-la' num iframe e você vai ver que ela irá tomar a janela principal do navegador.

Outras dicas deste autor

Mudar o gerenciador de login (GDM para SDDM e vice-versa) - parte 2

Instalando o Firefox de forma diferente no Linux

Quickcam Express no Ubuntu 9.04

Instalando o Skype no Mandriva One e superior

Procura um browser leve? Use o Epiphany!

Leitura recomendada

Slide de imagens em jQuery

Efetuando debug de JavaScript no Mozilla

Incentivando o uso do Webm, formato aberto de "codec" (conteiner) de vídeo

Programação orientada à objetos em JavaScript

Origens de spam - Investigando e colhendo informações

  

Comentários
[1] Comentário enviado por vmaia em 10/03/2010 - 19:47h

cool!!!!!!!



Contribuir com comentário




Patrocínio

Site hospedado pelo provedor RedeHost.
Linux banner

Destaques

Artigos

Dicas

Tópicos

Top 10 do mês

Scripts