Ir para conteúdo
Fórum Script Brasil
  • 0

Auto ajustar altura de iframe

Rafael Spilki

Perguntado por Rafael Spilki,

 Share

Pergunta

Rafael Spilki

Rafael Spilki

Postado
Postado

Daí gurizada! Tranquilo?

Seguinte... tenho essa dúvida a horas...

Normalmente uso esse codigo abaixo para auto ajustar as alturas de iframes:

<script>  
function adjustFrame(frame){  
var frmTemp;  
if (document.all) {  
var w = frame.document.body.scrollWidth;  
var h = frame.document.body.scrollHeight;  
   
if(frame.document.body.scrollWidth > frame.document.body.offsetWidth) {  
document.all[frame.name].height = h + 30;  
}  
else {  
document.all[frame.name].height = h;  
}  
}  
else if (document.getElementById) {  
  
var w = frame.document.width;  
var h = frame.document.height;  
  
if(frame.document.body.scrollWidth > frame.document.body.offsetWidth) {  
document.getElementById(frame.name).height = h;  
}  
else {  
document.getElementById(frame.name).height = h;  
}  
}  
return false;  
}  
</script>
<iframe name="gadget" id="gadget" marginheight="0" frameborder="0" width="100%" scrolling="no" onload="adjustFrame(gadget)" src="gadget.asp"></iframe>

o que acontece é que quando o src é uma página que eu mesmo fiz, como no caso acima, funciona perfeito...

Mas o que eu queria agora era colocar um forum PHPBB dentro de um IFRAME com altura auto ajustável... mas nesse caso o "auto ajuste" do iframe não funciona!

Alguém teria alguma suges? ou saberia explicar o porque? Nunca entendi isso muito bem! Onde está o meu erro?!?

[]'s Rafael Spilki

Link para o comentário
Compartilhar em outros sites

8 respostass a esta questão

Posts Recomendados

  • 0
Rafael Spilki

Rafael Spilki

Postado
  • Autor
Postado

Grande Jonh!

Posso mandar o link pra você por mp... mas assim, já notei que isso acontece por exemplo com o twitter...

Se eu tentar por exemplo colocar src=http://www.twitter.com acontece o mesmo erro... ou seja, a altura não ajusta!

A impressão que eu tenho é que quando o src é externo ao servidor ocorre o problema... tentei aqui por exemplo com a página do google deu a mesma coisa...

Link para o comentário
Compartilhar em outros sites
  • 0
Jonathan Queiroz

Jonathan Queiroz

Postado
Postado

Hm...

Vou testar aqui então usando o google, qualquer coisa posto aqui !

Edit:

Testei aqui e o navegador, por questões de segurança, bloqueia que scripts alterem páginas de outro domínio

Recebi o seguinte erro:

Unsafe JavaScript attempt to access frame with URL http://www.google.com.br/ from frame with URL http://localhost/teste.htm. Domains, protocols and ports must match.

Link para o comentário
Compartilhar em outros sites
  • 0
Rafael Spilki

Rafael Spilki

Postado
  • Autor
Postado (editado)

Agora vi que você testou isso localmente... será que não é alguma config sua de firewall ou outra coisa que esteja promovendo esse bloqueio?

Pra mim abre a página... só que não ajusta altura...

Vou pesquisar sobre isso e verificar se é possível fazer de outra forma

Bah... valeu mesmo... Andei pesquisando tb... achei outros códigos JS que prometiam fazer isso, mas o diagnóstico é sempre o mesmo...

edit.: com esse código a vida melhorou um pouco... o iframe fica maior... mas continua não abrindo em 100% a altura do src...

<iframe id="IdIframe" src="teste1.html" height="100%" width="100%"></iframe>
Adicione esse script dentro do "head" da página que vai ser carregada no iframe: 
<script language="javascript">
function resizeIframe() {
    
        i = parent.document.getElementById('IdIframe');
        if(i!=null){
            iHeight = document.body.scrollHeight;
            i.style.height = iHeight + 35 + "px";
        }
    }
</script>
O valor "35" é para dar um espaço "a mais" no iframe. Faça a chamada da função no "body" dessa página: 
<body onload="resizeIframe();">

fonte: http://forum.imasters.uol.com.br/index.php?showtopic=250832

[]'s

Editado por Rafael Spilki
Link para o comentário
Compartilhar em outros sites
  • 0
Jonathan Queiroz

Jonathan Queiroz

Postado
Postado

Boa tarde, Rafael

Consegui desenvolver uma outra forma de se fazer isso

O código consiste em modificar o objeto iframe da página principal de dentro do próprio frame

Sendo assim, não haveriam problemas com permissões

onload=function(){
            if(top.document!=document){
                //Lista de frames
                var lista_frames=top.document.getElementsByTagName("iframe")
                //Percorre todos os frames
                for(var i=0;i<lista_frames.length;i++){
                    var f=parent.frames[lista_frames[i].name]
                    //Verifica se o frame é a página atual
                    if(f.document==document){
                        //Se sim, redimensiona
                        var y,h
                        if(document.all){
                            h=document.body.scrollHeight
                            var y=top.document.all[lista_frames[i].name]
                            y.style.height=h
                        }else{
                            h = f.document.height;
                            y=top.document.getElementById(lista_frames[i].id)
                            y.style.height=h
                        }
                    }
                }
            }
        }

Edit:

Não adiantou muita coisa...

O navegador também não deixa o iframe modificar a página principal

Link para o comentário
Compartilhar em outros sites
  • 0
Rafael Spilki

Rafael Spilki

Postado
  • Autor
Postado (editado)

Bom... Então... fiz uma aqui muito POG, mas até que deu certo... mas ficou longe de perfeito...

Fiz assim:

</script>

<script language="javascript">
function resizeIframe() {
    
        i = parent.document.getElementById('forum');
        if(i!=null){
            iHeight = document.body.scrollHeight;
            i.style.height = iHeight - 15 + "px";
        }
    }
</script>
esse -15px no final é para dar uma recuada na height de forma a mostrar a setinha de baixo do scroll... o html ficou assim (reparem a tag body): 
<body style="overflow-y: hidden; overflow-x: hidden;" onLoad="resizeIframe();">
<iframe id="forum" src="http://www.meudominio.com.br/forum" height="100%" width="100%"></iframe>
</body>

Mas definitivamente ainda não ta do jeito que eu queria... mas enfim... sigo procurando...

Edit.: o recuo deveria ser maior no caso do google chrome, mas testei aqui no IE6, IE7 e FF e até que fica legalzinho... mas reafirmo... ainda não é o ideal...

[]'s Rafael Spilki

Editado por Rafael Spilki
Link para o comentário
Compartilhar em outros sites

Participe da discussão

Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.

Visitante
Responder esta pergunta...

×   Você colou conteúdo com formatação.   Remover formatação

  Apenas 75 emoticons são permitidos.

×   Seu link foi incorporado automaticamente.   Exibir como um link em vez disso

×   Seu conteúdo anterior foi restaurado.   Limpar Editor

×   Você não pode colar imagens diretamente. Carregar ou inserir imagens do URL.

×
 Share
Ir para lista de Perguntas


  • Estatísticas dos Fóruns

    • Tópicos
      152,3k
    • Posts
      652,3k
×
×
  • Criar Novo...