Ir para conteúdo

POWERED BY:

Arquivado

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

fabiodurgante

div dentro de div

Por , em Javascript

Recommended Posts

fabiodurgante    0

fabiodurgante
Postado 

<style type="text/css">
#panel {
		background: #C4C4C4;	
	height: 5px;

	display: none;
     border-bottom: solid 4px #15276F;      
}
#panel2 {
	
	background-color:#C4C4C4;
	height: 5px;
	display: none;
    border-top: solid 4px #15276F;		
}
</style>


<div id="panel" style="display:none" >

<div id="panel2" style="display:none" >

<center>
<iframe id="iframe" name="iframe" src=""  width="400" height="300"   frameborder="0" scrolling="no" marginheight="0" marginwidth="0" > </iframe>
</center>
<input type="button"  value="VOLTAR" onClick='fechar()'/>
</div>

<a href="#" onClick='abre("integrantes/fabio.html");' > Fabio </a>
link2
link3

aqui o restante do codigo do panel esta funcionando perfeito ate aqui"""


   function fechar(){

 $('#panel2').animate({width: "2",opacity : 1}, 1300) 
  $('#panel2').animate({height: "2",opacity:0},1300)
  $('#panel2').style="display:none"

 } 

function abre(id_integrante){

  $('#panel2').animate({height: "343",opacity : 0.9},1300)

document.getElementById('iframe').src=id_integrante;


}

no panel tenho varios links que cada um desses links chama a funcao ABRE e passo o ID para abrir no PANEL2 que esta dentro da PANEL, abre certo porem quando clico no botao que chama a funcao fechar quero que a PANEL2 fique oculta do mesmo modo que ocorre quando abre a pagina pela primeira vez a PANEL2 esta oculta depois nao consigo mais ocultar a PANEL2

 

como fazer isso ???

Compartilhar este post

Link para o post
Compartilhar em outros sites

Holt    1

Holt
Postado

Vais ter que deixar a div "escondida" usando um display:none;

e para fazer o "efeito" pode utilizar jquery...

Compartilhar este post

Link para o post
Compartilhar em outros sites

fabiodurgante    0

fabiodurgante
Postado

isso mesmo que eu quero presiso deichar a div escondida a div que contenha o PANEL2

 

mas presiso esconder a div quando clicar no botao o botao chama essa funcao

 

function fechar(){

 

$('#panel2').animate({width: "2",opacity : 1}, 1300)

$('#panel2').animate({height: "2",opacity:0},1300)

$('#panel2').style="display:none"

 

}

 

aqui minha div quero esconder ela, a primeira vez que abro a pagina essa div sai escondida tudo certo, depois que abro essa div nao consigo esconder ela novamente

 

<div id="panel2" style="display:none" >

 

 

como eu escondo a div pela funcao ????????

 

usei isso aqui

document.getElementById(panel2).style.visibility = "hidden";

 

porem nao da certo nao ela nao esconde a div panel2

Compartilhar este post

Link para o post
Compartilhar em outros sites

fabiodurgante    0

fabiodurgante
Postado

isso mesmo que eu quero presiso deichar a div escondida a div que contenha o PANEL2

 

mas presiso esconder a div quando clicar no botao o botao chama essa funcao

 

function fechar(){

 

$('#panel2').animate({width: "2",opacity : 1}, 1300)

$('#panel2').animate({height: "2",opacity:0},1300)

$('#panel2').style="display:none"

 

}

 

aqui minha div quero esconder ela, a primeira vez que abro a pagina essa div sai escondida tudo certo, depois que abro essa div nao consigo esconder ela novamente

 

<div id="panel2" style="display:none" >

 

 

como eu escondo a div pela funcao ????????

 

usei isso aqui

document.getElementById(panel2).style.visibility = "hidden";

 

porem nao da certo nao ela nao esconde a div panel2

 

 

ai o codigo inteiro da pagina, fica sempre o espaco do iframe o PANEL nao fica por cima do iframe

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script type="text/javascript" src="js/jquery.js"></script>

<script type="text/javascript">   

  $(window).load(function() {   
  
  $('#panel').animate({width: "3",opacity : 0.8}, 1)
   		  
        $('#panel').animate({width: "885",opacity : 0.8}, 1300)
            $('#panel').animate({height: "325",opacity : 0.9},1300)
       	   
   	$(this).toggleClass("active"); return false;

 }
 )
 
   function fechar(){

  $('#panel2').animate({height: "0",opacity:0},1300)
  
  
document.getElementById('panel2').style.visibility = "hidden";   
 document.getElementById("panel2").style.display="none" 

 } 

function abre(id_integrante){

  $('#panel2').animate({height: "343",opacity : 0.9},1300)

document.getElementById('iframe').src=id_integrante;


}

</script>


<style type="text/css">

#panel {
position: absolute;
z-index: 1;
		background: #C4C4C4;	
	height: 5px;

	display: none;
     border-bottom: solid 4px #15276F;

      
}
#panel2 {
	background-color:#C4C4C4;
	height: 5px;
	display: none;
    border-top: solid 4px #15276F;

		
}

</style>
</head>

<body onload='loader()'>

<div id="loader" style="position:absolute; width:885px; margin-top:60px;" > <center> <img src="images/loading.gif" > Carregando...  </center>
 </div>


<div id="panel" style="display:none" >

<div id="panel2" style="display:none" >

<iframe  "id="iframe" name="iframe" src=""  width="400" height="300"   frameborder="0" scrolling="no" marginheight="0" marginwidth="0" > </iframe>
<input type="button"  value="VOLTAR" onClick='fechar()'/>
</div>
          
            <a href="#" onClick='abre("integrantes/fabio.html");' > Fabio </a>


</div>



</body>
</html>

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