Ir para conteúdo

POWERED BY:

Arquivado

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

brcontainer

[Resolvido] Iframe auto ajustavel 2

Por , em Javascript

Recommended Posts

brcontainer    16

brcontainer
Postado

Eu percebi que havia alguns sistemas porem possuiam alguns problemas com a segurança do BROWSER.

Ou uso de tabelas, então resolvi fazer de uma maneira aproveitando o CSS.

 

pagina.htm:

<style>
*{
margin:0;padding:0;
}
#iframe{
overflow:hidden;
}
</style>
<script>
function WHFRAME(w,h){
var FrameWH = document.getElementById("iframe");
alert(h);
FrameWH.style.width = (w)+"px";
FrameWH.style.height = h+"px";
}
</script>

<iframe src="iframe.html" id="iframe"></iframe>

iframe.htm:

<html>
<head>
<title>pagina</title>
<style>
*{
margin:0;padding:0;
}
html,body{
overflow:hidden;
}
#corpo{
width:990px;
height:auto;
}
</style>
<script type="text/javascript">
function ResizeWH(){
var w;
var h;

w = document.getElementById("corpo").clientWidth;
h = document.getElementById("corpo").clientHeight;
parent.WHFRAME(w,h);
}
</script>
</head>
<body>
<div id="corpo">
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p>
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p>
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p>
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p>
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p>
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p>
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p>
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p>
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p>
<p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p> <p>Conteudo</p>
</div>
</body>
<script>
ResizeWH();
</script>
</html>

Entedendo o CSS.

No firefox o SCROLL some normalmente porem IE6 não é funcional a barra de rolagem não responde a comando dinamicos do HEIGHT ou WIDTH.

 

Então devemos ocultar o SCROLL:

iframe{
overflow:hidden;
}

porem o IE considera o SCROLL do BODY dentro do FRAME, então a solução seria criar um CSS dentro do IFRAME que oculte a BARRA DE ROLAGEM(scroll):

html,body{
overflow:hidden;
}
Obs.: deve-se definir o HTML no seletor do css tambem, pois o IE considera a TAG HTML como a POSSUIDORA do SCROLL.

 

o SCRIPT deve ser execultado de dentro do IFRAME pois os navegadores em segurança media consideram isso como mais seguro.

O resto é simples.

 

Abraços a todos.

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