Foros del Web » Programando para Internet » Javascript »

mostrar y ocultar iframe

Estas en el tema de mostrar y ocultar iframe en el foro de Javascript en Foros del Web. hola tengo una duda, te un pagina php main.php esta tiene 2 iframe la idea es hacer q con un menu le indique cual se ...
  #1 (permalink)  
Antiguo 22/12/2010, 17:26
 
Fecha de Ingreso: abril-2008
Mensajes: 310
Antigüedad: 13 años, 1 mes
Puntos: 4
mostrar y ocultar iframe

hola
tengo una duda, te un pagina php main.php esta tiene 2 iframe la idea es hacer q con un menu le indique cual se muestre y el otro se oculte espero me entiendan gracias
  #2 (permalink)  
Antiguo 22/12/2010, 17:38
 
Fecha de Ingreso: diciembre-2010
Mensajes: 788
Antigüedad: 10 años, 5 meses
Puntos: 50
Respuesta: mostrar y ocultar iframe

Te paso un ejemplo:

Código HTML:
Ver original
  1. <iframe src="http://google.com" id="ifr1">
  2.  

para ocultarlo

Código Javascript:
Ver original
  1. <script>
  2.  
  3. document.getElementById("ifr1").style.display="none";
  4. </script>

para mostrarlo

Código Javascript:
Ver original
  1. <script>
  2.  
  3. document.getElementById("ifr1").style.display="block";
  4. </script>
  #3 (permalink)  
Antiguo 22/12/2010, 17:40
Avatar de Panino5001
Me alejo de Omelas
 
Fecha de Ingreso: mayo-2004
Ubicación: -34.637167,-58.462984
Mensajes: 5.141
Antigüedad: 17 años
Puntos: 831
Respuesta: mostrar y ocultar iframe

cla so tnés q pnerle 1 id a c/iframe i cambiar la prop css display de block a none usando el método getElementById
  #4 (permalink)  
Antiguo 22/12/2010, 17:48
 
Fecha de Ingreso: abril-2008
Mensajes: 310
Antigüedad: 13 años, 1 mes
Puntos: 4
Respuesta: mostrar y ocultar iframe

voy a checarlo a ahora comento
  #5 (permalink)  
Antiguo 23/12/2010, 09:58
 
Fecha de Ingreso: abril-2008
Mensajes: 310
Antigüedad: 13 años, 1 mes
Puntos: 4
Respuesta: mostrar y ocultar iframe

walterdevel como hago para activar la funcion que al darle click a un menu este me funcione disculpa es q soy algo nuevo
  #6 (permalink)  
Antiguo 23/12/2010, 12:10
wjr
 
Fecha de Ingreso: diciembre-2010
Mensajes: 32
Antigüedad: 10 años, 5 meses
Puntos: 0
Respuesta: mostrar y ocultar iframe

haces esto:

Código Javascript:
Ver original
  1. function toggleIfrm(id) {
  2. if(document.getElementById(id).style.display=="block") {
  3.   document.getElementById(id).style.display="none";
  4. } else {
  5.   document.getElementById(id).style.display="block";
  6. }
  7.  
  8. }


el html

Código HTML:
Ver original
  1. <a href="javascript:toggleIfrm('ifr1')"> Toggle</a>

No lo probé, no se si está ok.
  #7 (permalink)  
Antiguo 27/12/2010, 23:29
 
Fecha de Ingreso: abril-2008
Mensajes: 310
Antigüedad: 13 años, 1 mes
Puntos: 4
Respuesta: mostrar y ocultar iframe

wjr esta bien tu codigo ya lo probe
pero como le hago para que los iframes al inicio no se muestren y cuando se le de click al menu este muestre uno ej ifr1 y al darle al otro menu se deshaparezca y salga el jfr2 espero me entienda gracias
  #8 (permalink)  
Antiguo 29/12/2010, 16:57
 
Fecha de Ingreso: abril-2008
Mensajes: 310
Antigüedad: 13 años, 1 mes
Puntos: 4
Respuesta: mostrar y ocultar iframe

amigos como le hago para que cuando se le de click a una menu me muestre el ifrema pero el otro se oculte?
que le falta al codigo que nos dio WJR

Cita:
<script>
 
function toggleIfrm(id) {
if(document.getElementById(id).style.display=="non e") {
  document.getElementById(id).style.display="block";
} else {
  document.getElementById(id).style.display="none";
}
 
}
</script>
  #9 (permalink)  
Antiguo 30/12/2010, 09:46
Avatar de Algadar  
Fecha de Ingreso: abril-2009
Mensajes: 115
Antigüedad: 12 años, 1 mes
Puntos: 1
Respuesta: mostrar y ocultar iframe

Así te deberia funcionar.

Código:
<style type="text/css">
#apDiv1 {
	position:absolute;
	width:200px;
	height:115px;
	z-index:1;
}
</style>
</head>
<script type="text/javascript">
 function toggleIfrm(id) {
      if(document.getElementById(id).style.visibility=="hidden") {

        document.getElementById(id).style.visibility="visible";

      } else {

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

      }

      }
 </script>
<body>
<form id="form1" name="form1" method="post" action="">
<div id="apDiv1" style="visibility:hidden">
  <iframe src="http://google.com" id="ifr1"  >
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  </iframe>
  </div>
  <p>&nbsp;  </p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>
    <input type="button" name="button" id="button" value="Botón" onclick="toggleIfrm('apDiv1')" />
  </p>
</form>
__________________
Deseo poco y lo poco que deseo, lo deseo poco.!
De Colores.

Última edición por Algadar; 30/12/2010 a las 09:53
  #10 (permalink)  
Antiguo 05/01/2011, 13:26
 
Fecha de Ingreso: abril-2008
Mensajes: 310
Antigüedad: 13 años, 1 mes
Puntos: 4
Respuesta: mostrar y ocultar iframe

Algadar gracias esta buena tu opcion pero si yo le pongo un menu css en vez de un boton este me cojeria si lo doy al li 1 muestre el if1 luego le del a li 2 y este oculte el if1 y muestre el if2 ??
y q guarde la posicion del iframa en la url he

Etiquetas: iframe
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 14:29.