Jump to content


Photo

Iframes Com Altura Variavel.


  • Faça o login para participar
17 replies to this topic

#1 jlima2001

jlima2001

    Novato no fórum

  • Usuários
  • 14 posts
  • Sexo:Não informado

Posted 22/06/2004, 12:03

Possuo um site que utiliza dois iframes. um que fica estático na parte de cima e outro central que mostra o conteudo do site.
O problema é o seguinte: a pagina inicial que é carregada no iframe central tem uma altura de 1500 px, mas uma outra determinada pagina do site que for carregada neste iframe pode ser mais alta ou menos alta.
Se eu determino que este iframe vai ter sempre a mesma altura, por exemplo: height="1500px", algumas páginas pode ficar cortadas ou com espaço de sobra no final.
Como fazer que a altura do iframe varie de acordo com a altura da página carregada nele?
Já procurei artigos sobre isso na web e não encontrei nada que funcionasse. Utilizei height="100%" e também não funcionou.
Aguardo que um webmaster fera possa achar uma solução pra isso.
Para ver o site em questão que eu estou falando, acesse www.radioliderfm.com.br e vcs terão a noção exata do que estou falando.
Desde já agradeço a ajuda de todos.

Jonas Lima.

#2 _MX_

_MX_

    Conhecimento nunca é demais

  • Usuários
  • 563 posts
  • Sexo:Não informado
  • Localidade:Diadema-sp

Posted 22/06/2004, 13:30

tente isso:

Na página que contém o iframe cria a seguinte função:

<script language="JavaScript">
function redimensiona(altura){
   document.getElementById('nome_do_iframe').style.height=altura;
}
</script>


na página que será carregada dentro do iframe coloque o seguinte código:

<script language="JavaScript">
parent.redimensiona(263)
</script>

espero ter ajudado
========================================================
Copiar o bom é melhor que inventar o ruim
========================================================
"O segredo da criatividade é saber esconder suas fontes"
(Einstein)
========================================================

#3 jlima2001

jlima2001

    Novato no fórum

  • Usuários
  • 14 posts
  • Sexo:Não informado

Posted 22/06/2004, 14:00

ok, __mx__.
isso funciona sim, mas com páginas estaticas, que nunca mudam de altura.
mas tenho sripts em php que podem fazer a mesma pagina ter alturas diferentes, de acordo com o que o php gera.
por exemplo, pesquisas de usuarios cadastrados: pode dar o resultado de 2 usuarios ou 100 usuarios, que fara com que a mesma pagina tenha alturas diferentes.
outra coisa:
também mudo páginas a cada semana, e aí então teria que mudar o valor no script.

#4 _MX_

_MX_

    Conhecimento nunca é demais

  • Usuários
  • 563 posts
  • Sexo:Não informado
  • Localidade:Diadema-sp

Posted 22/06/2004, 14:24

então coloque os scripts php dentro de uma div com id, daí mude o código assim:

<script language="JavaScript">
parent.redimensiona(document.getElementById('id_da_div').style.height)
</script>

eu nao testei mas acho que funciona
========================================================
Copiar o bom é melhor que inventar o ruim
========================================================
"O segredo da criatividade é saber esconder suas fontes"
(Einstein)
========================================================

#5 jlima2001

jlima2001

    Novato no fórum

  • Usuários
  • 14 posts
  • Sexo:Não informado

Posted 22/06/2004, 14:34

entendi. o script pega a altura da div e chama a função redimensiona que altera a altura do iframe de acordo com a altura da div. legal!!
o problema é que eu vou ter q definir uma altura fixa para a div.
vai acabar dando na mesma. o iframe muda de altura de acordo com a altura da div, mas a altura da div é fixa. entendeu?
não existe um comando javascript que pegue a altura da pagina?

#6 _MX_

_MX_

    Conhecimento nunca é demais

  • Usuários
  • 563 posts
  • Sexo:Não informado
  • Localidade:Diadema-sp

Posted 22/06/2004, 14:43

achei o jeito certo.

http://forum.wmonlin...showtopic=60551
========================================================
Copiar o bom é melhor que inventar o ruim
========================================================
"O segredo da criatividade é saber esconder suas fontes"
(Einstein)
========================================================

#7 Troyan

Troyan

    12 Horas

  • Usuários
  • 285 posts
  • Sexo:Não informado
  • Localidade:Mesquita, Rio de Janeiro - Brasil
  • Interesses:Sou programador ASP, PHP, Javascript e ActionScript, além de ser curioso em JSP, ColdFusion e XSL. Trabalho com XML, XHTML, adoro webstandards e a W3C. Também trabalho com tableless e RIA's.<br><br> Formas de contato:<br> Email: dnunes[at]gmail[dot]com<br> ICQ: 68102402<br> MSN: troyandev@hotmail.com<br><br> -------------------------------------<br> - Rio de Janeiro, Brazil<br> - Troyan

Posted 22/06/2004, 15:02

...Eu faria isso apenas com um script na página-mãe... Mas já que estamos falando de acionamento de dentro do iFrame, usa document.body.scrollHeight pra pegar a altura.

....[]s
~~ ~
diego nunes
web engineer

~ ~~

#8 jlima2001

jlima2001

    Novato no fórum

  • Usuários
  • 14 posts
  • Sexo:Não informado

Posted 22/06/2004, 15:09

fiz do jeito do __mx__ e funcionou na hora.
só tive que fazer umas alterações, pq o programa que crio paginas nao permite que eu altere o codigo html gerado por ele.
então o q fiz, criei um div no rodape dá pagina e fiz o javascript pegar a posição dele (top) e nao a altura (height) do div, não o tamanho dele. pronto!!!
valeu mesmo!!!
obrigadão!

#9 jlima2001

jlima2001

    Novato no fórum

  • Usuários
  • 14 posts
  • Sexo:Não informado

Posted 22/06/2004, 16:59

AGORA EU ENTENDI!!!!
essa parada que o Troyan postou é melhor ainda.
usar o body.scrollheight para pegar a altura é simplesmente tudo. nao depende de criar div e nada mais.
MUITO BOM TROYAN!!!!
PARABENS!!!
E PARABENS TAMBEM AO __MX__ POR FAZER A PESQUISA DO SCRIPT.

#10 feubr

feubr

    Normal

  • Usuários
  • 80 posts
  • Sexo:Não informado

Posted 22/06/2004, 22:49

...Eu faria isso apenas com um script na página-mãe... Mas já que estamos falando de acionamento de dentro do iFrame, usa document.body.scrollHeight pra pegar a altura.

....[]s

Olá Troyan, será que vc pode ser um pouco mais explícito ? Please ?

Pegando carona na dúvida do amigo, tenho o mesmo problema.

Tenho o Top, o Bottom e o Body, todos os tres sao paginas que tenho que carregar dinamicamente e podem ter o tamanho variado, mas não entendi bem como utilizar a sua dica.

Vc, por favor, poderia me ajuda ?

Muito obrigado.

#11 jlima2001

jlima2001

    Novato no fórum

  • Usuários
  • 14 posts
  • Sexo:Não informado

Posted 23/06/2004, 11:05

Se eles forem Iframes, é muito facil.
Vamos supor que o seu frame no topo tenha o nome "CABECALHO", o do meio seja "CORPO" e o de baixo seja "RODAPE".
Em todas as paginas que forem carregadas no CABECALHO, adicione o seguinte codigo:
<script language="JavaScript" type="text/javascript">
parent.document.getElementById("cabecalho").height = document.body.scrollHeight;
parent.scrollTo(0,0);
</script>


nas paginas que forem carregadas no frame "CORPO" e no "RODAPE", é só adicionar em cada pagina o mesmo codigo, bastando alterar a palavra "cabecalho" por "corpo" ou "rodape".

Explicando como o codigo funciona:
parent.document.getElementById("cabecalho").height
Essa é a variavel que define a altura (height) do objeto "cabecalho", que está no "parent", ou seja, na pagina anterior a que está sendo carregada.
parent.document.getElementById("cabecalho") é o objeto.
height é a propriedade do objeto.

Agora resta saber qual a altura que esse objeto deve ter. Essa altura vai variar de pagina para pagina. Então, precisamos saber a altura da pagina carregada. Aí é que vem...
document.body.scrollHeight

document.body é o objeto, ou seja o corpo da pagina.
scrollheight é a propriedade somente para leitura que define a altura do objeto.

PS.: é importante que a pagina que será carregada dentro do frame possua as tags <body> e </body>. Normalmente todas são assim.

Espero poder ter ajudado.

Edição feita por: jlima2001, 23/06/2004, 11:07.


#12 Troyan

Troyan

    12 Horas

  • Usuários
  • 285 posts
  • Sexo:Não informado
  • Localidade:Mesquita, Rio de Janeiro - Brasil
  • Interesses:Sou programador ASP, PHP, Javascript e ActionScript, além de ser curioso em JSP, ColdFusion e XSL. Trabalho com XML, XHTML, adoro webstandards e a W3C. Também trabalho com tableless e RIA's.<br><br> Formas de contato:<br> Email: dnunes[at]gmail[dot]com<br> ICQ: 68102402<br> MSN: troyandev@hotmail.com<br><br> -------------------------------------<br> - Rio de Janeiro, Brazil<br> - Troyan

Posted 23/06/2004, 12:22

..Sobre o lance que eu falei de uma função só, seria algo como...

<script type="text/javascript">
top.nomeframe='NOME_DO_SEU_IFRAME';
top.idIFrame='ID_DO_SEU_IFRAME';

document.onclick=function() { var clickLink=0;
  if ((tO=event.srcElement).tagName == 'A') { clickLink=1; }
  while (tO.tagName != 'A' && tO.tagName != 'BODY') { tO=tO.parentElement;
    if (tO.tagName == 'A') { clickLink=1; }
  }
  if (clickLink && tO.target == top.nomeframe) {
    hrefAtual=(tFd=(tFr=window.frames[top.nomeframe]).document).location.href;
    top.timer=top.setInterval(function() {
      if (tFd.href != hrefAtual) {
        tFr.setTimeout(function() { parent.document.getElementById(top.idIFrame).style.height=tFd.body.scrollHeight; },0);
        tFr.onload=function() { parent.document.getElementById(top.idIFrame).style.height=tFd.body.scrollHeight; };
      }
      top.clearInterval(top.timer);
    },200);
  }
}
</script>



..Não conferi, então se tiver algum erro me avisa que eu corrijo, ok?

..Ps.: Caso não tenham entendido, a idéia é que simplesmente colocando esse script na página que contém o Iframe (não nas páginas contidas nele), ao clicar num link com target=NOME_DO_IFRAME, ele, automaticamente, ajuste a altura.

....[]s
~~ ~
diego nunes
web engineer

~ ~~

#13 Ademir Diniz

Ademir Diniz

    Novato no fórum

  • Usuários
  • 1 posts
  • Sexo:Não informado

Posted 21/08/2008, 19:15

Olá Galera... sou novo aqui, por tanto se eu fizer algo errado me corrijam, por favor.
então eu usei o cód que o _MX_ passou e funcionou perfeitamente no IE7, mas não funcionou no FireFox e ainda não testei em outros fora os dois.
Sabem me informar como faço pra funcionar pelo menos nesses dois navegadores?
Ou sabem como criar essa opção que o iframe nos dá com DIV e AJAX?

abraço a todos

#14 Nicholas Pufal

Nicholas Pufal

    Impossível: só existe até alguém duvidar e provar o contrário.

  • Usuários
  • 1655 posts
  • Sexo:Masculino
  • Localidade:Porto Alegre

Posted 21/08/2008, 19:50

Bem-vindo!

O código que o _MX_ postou data de 2004, ou seja, é uma solução defasada.

Te recomendo a abrir outro tópico com esta sua dúvida.

Aproveite e leia as regras do fórum.
BLOG Touché Criação - Vamos trocar idéias? -> http://blog.touchecriacao.com.br/
// Links úteis: Busca || Regras
// Não respondo dúvidas via mensagem privada. Use o fórum para buscar ou perguntar.

#15 Miguceamma

Miguceamma

    MiguPenjisse

  • Usuários
  • 11724 posts

Posted 10/10/2017, 08:04

Comprar Viagra Por Paypal buy viagra online Voglio Acquistare Cialis
Ez Online Pharmacy Acheter Finasteride Biogaran Doxine Without Prescription Canada viagra prescription Rapidtabs
Priligy Dapoxetina Commenti vardenafil vs viagra Cialis Erboristeria




1 user(s) are reading this topic

0 membro(s), 1 visitante(s) e 0 membros anônimo(s)

IPB Skin By Virteq