Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Bacsh

Altura dinâmica do iframe.

Por , em Javascript

Recommended Posts

Bacsh    4

Bacsh
Postado

Olá galera, tudo bem? Espero que sim :D

 

Estou com um pequeno problema com um iframe, estou quebrando a cabeça a dias e não consigo achar uma solução.

 

É o seguinte, eu tenho um box de largura e altura fixas no qual eu coloco o conteúdo dentro, quando o conteúdo ultrapassa a altura do box aparece um barra de rolagem personalizada em jquery.

 

O problema surgiu quando precisei colocar um iframe dentro desse box com largura dinâmica, ou seja, o usuário vai alterar o conteúdo deste iframe então ele pode ter uma altura enorme assim que pode ser bem pequeno e não precisar da barra de rolagem.

 

O primeiro trabalho foi achar essa tal função para medir a altura da página, mas felizmente consegui, segue o código:

 

<script language="Javascript" type="text/javascript">
		
  parent.document.getElementById("brunoteste32321").height = document.getElementById("tamanho").scrollHeight - 190; //40: Margem Superior e Inferior, somadas
		
</script>

 

Essa função adiciona uma altura no meu iframe com id "brunoteste32321" medindo a div "tamanho" dentro do meu iframe.

 

Tudo muito bom e legal, o problema está no seguinte, quando eu abro a página do iframe eu vejo que a altura está indo, mas a barra lateral de rolagem em jquery não aparece, então eu fecho a janela e abro novamente a barra magicamente está lá, ao meu ver parece que a função jquery de aparecer a barra de rolagem ou não está sendo lida antes do iframe pegar um valor de altura.

 

Engraçado também é que quando eu coloco para inspecionar o elemento no firebug a barra aparece, é só clicar em inspecionar e já era, está lá a barra... é muito estranho isso, eu acho que quando você abre o firebug ele deve fazer uma releitura dos arquivos sei lá, ou pode ser bug também, eu realmente não sei.

 

Estou perdido neste problema, não sei se é bug, se é problema de ordem na leitura dos scripts, enfim, alguém consegue me ajudar?

Compartilhar este post

Link para o post
Compartilhar em outros sites

fernandotholl    19

fernandotholl
Postado

Posta o código para analisarmos o que está acontecendo.

 

Se ajudar posta no http://jsfiddle.net

 

Abraço

Compartilhar este post

Link para o post
Compartilhar em outros sites

Bacsh    4

Bacsh
Postado

Olá Fernando,

 

Obrigado por responder, eu não sei direito como faz para postar nesse site que você passou, eu descobri que é um bug no Firefox mesmo, a barra está aparecendo no IE e no Chrome normalmente, quando eu clico em inspecionar elemento no Firefox a barra de rolagem magicamente aparece. Apesar de isso não fazer sentido nenhum.

 

Outro problema que está dando também é um erro:

GET http://www.kabutz.com.br/novo/undefined 404 (Not Found)

No Console, mas já estou tentando resolver isso.

 

(PS: Já consegui resolver o problema do erro 404, era algumas funções que estava chamando que não eram necessárias. Apenas o problema da barra de rolagem não aparecer no Firefox persisti.)

 

O website em questão está no www.kabutz.com.br/novo/index.php

 

Aqui vai alguns códigos para ver se lhe ajuda:

index.php: Chamando página video.php

 

<li > <a class="normala" href="video.php" target="brunoteste32321" id="videos">  <span class="active"></span> <span class="wrap"> <span class="link">Vídeos</span>  </span> </a> </li>

 

 

index.php: Código do iframe

 

<iframe width="760" src="video.php" name="brunoteste32321" id="brunoteste32321" scrolling="no" frameborder="0" vspace="0"></iframe>

 

video.php: Estrutura

 

<body>
<div class="autoaltura">
<div id="tamanho567">

Conteúdo Qualquer

 <div class="border"></div>
        

</div>
    </div>    

</body>

 

 

video.php: Javascript que mede a altura da página com algumas alterações.

 

<script type="text/javascript">
        window.onload = function GetContainerSize () {
   	var xd = document.getElementById("tamanho567");
	var message =  xd.scrollHeight;	
	parent.document.getElementById("brunoteste32321").height = message;	
   }		
</script>

 

 

Você pode ver o problema que está acontecendo na barra de rolagem no firefox clicando no menu VÍDEOS do website.

 

Obrigado :)

Compartilhar este post

Link para o post
Compartilhar em outros sites

fernandotholl    19

fernandotholl
Postado

Amigo, eu acredito que seu problema esta mais relacionado ao Plugin exclusivamente no Firefox.

Tentei passar alguns parâmetros do próprio plugin que não surtiram efeito, mais encontrei esse exemplo na documentação oficial que talvez resolva seu problema:

 

http://manos.malihu.gr/tuts/custom-scrollbar-plugin/iframe_example.html

 

:!: Cara, o site está muito carregado, meu computador não é fraco, e no firefox é praticamente impossível inspecionar elementos com o Firebug. Da uma revisada no tamanho e tempo de carregamento do seu site.

 

Kabutz? È de Floripa? Já estive nesse local!

No mais parabéns pelo site, muito bonito.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Bacsh    4

Bacsh
Postado

Olá amigo, sim o site é do Kabutz em Floripa, obrigado pelo elogio, bom vamos lá.

 

O plugin está funcionando corretamente já, o problema é esse iframe com tamanho dinâmico com esse plugin. Se eu coloco uma altura minima para o iframe grande a barra aparece normalmente, o problema acontece é que ele está atribuindo um valor para o iframe depois de verificar se há necessidade de barra de rolagem, tanto é que se eu clico no menu Vídeos novamente a barra aparece, o estranho é que isso só ocorre no firefox mesmo.

 

No mais obrigado pela ajuda, vou dar uma estudada melhor no plugin e ver se alguém já teve esse tipo de problema.

 

Sobre o peso do site:

http://tools.pingdom.com/fpt/#!/Ia7rBsPBt/www.kabutz.com.br/novo/index.php

Demora 2/3 segundos para carregar ele inteiro, contando a animação no meio, diz também que é 68% mais rápido que os sites já testados lá, enfim, eu acho que está bom, no mais vou tentar reduzir algumas coisas, note que o tamanho de 5.6m também por causa da música, só ela é 2mega, mas ela está em ogg então faz pre-carregamento.

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito