3

El problema es el siguiente. Tengo un total de 4 iframes dentro de mi sitio web, el unico que se mueve es el de contenido los demás se quedan inmóviles, el que se mueve constantemente no tiene problemas, la cuestión cambia cuando uno de los otros frames debería ponerse por debajo del de contenido o moverse a un lado para que este no le estorbe al principal, ya que si lo dejo así, no puedo dar click al principal porque este esta puesto debajo del mismo ya lo eh intentado de la siguiente manera:

        <script>

    function ocultar() {
        window.parent.frames[3].document.body.style.display = "none";

    }


    </script>

Esta función debería de ocultarme el frame y lo hace en cierta medida, ya que lo que me oculta es lo que hay dentro del frame y yo no quiero eso, sino que todo el marco del frame sea desvanecido, ocultado o movido en alguna dirección que no me estorbe, a continuacion les dejo el como esta acomodado mis frames

<body onload="ocultar()"   >

    <div >

        <center><label style="font-family: titulo;font-size: 42px;color: red;">Proyecto Hidruth</label></center>
        <center> <div ><iframe name="frame-menu" id="framemenu" src="PHP/menu.php"></iframe></div></center>
        <div ><center><iframe   style="border-width: 0px;background-color: #393030;background-color: #c3b6b6;"  id="informacion2" src="PHP/ayudas/ayuda.inicio.php"></iframe></center></div>
        <div ><center><iframe name="frame-contenido" id="frameinicio" style="z-index: -10000;" src="PHP/inicio.php"></iframe></center></div>
        <div ><center><iframe id="frame-articulo" name="frame-articulo" style="float: right;margin-top: -10%;margin-left: -45%;width:60%;height: 92%;margin-top: -50%;z-index: 1000;position: absolute;"   src="PHP/articulos/inicio_articulos.php"></iframe></center></div>

        <div><center><iframe  style="background-color: orangered;border:0;border-radius: 5px;" id="framepie"  src="PHP/piepagina.php"></iframe></center></div>
    </div> 






</body>

de antemano gracias por leer mi comentario.

Codigo para ocultar:

        function ocultar() {

document.querySelectorAll("iframe")3.style.display = "none";

    }

codigo para mostrar:

function articulos() {
window.parent.frames[2].location = "articulos.php"
window.parent.frames[1].location = "ayudas/ayuda.articulos.php"
    alert(document.querySelectorAll("iframe")[3]);

document.querySelectorAll("iframe")[3].style.display = "block";


var scary = document.getElementById("scary");
scary.play();

}

Cuando carga inicialmente todos los frames si oculta el que yo requiero:

Ventana de Inicio

Cuando doy click en el menu articulos deberia reaparecer el frame que inicialmente lo oculte y me sale este error

Ventana de articulos

El orden de mis elementos es el siguiente: En javascript se en cuentra mi archivo donde hago la accion de articulos y en php cargo todos mis frames y al mismo tiempo oculto el que no necesito inicialmente

orden de elementos

1
  • ¿Puedes añadir una imagen tipo esquema para entender como quieres disponer los iframes? Si tus iframes fueran "Responsive creo que te solucionarían el problema". Commented el 20 jul. 2016 a las 7:34

1 respuesta 1

2

No estás aplicando el estilo al iframe sino al body de la página dentro del iframe. Entonces sigues con el mismo problema porque el iframe en sí sigue siendo visible y sigue estorbando a la hora de hacer click.

La solución sería aplicar los estilos directamente al iframe. Eso lo puedes hacer de diferentes formas dependiendo de cómo tengas estructurada la página:

  • Si el iframe tiene un id entonces aplica el estilo directamente al elemento con ese id:

    function ocultar() {
        document.getElementById("iframe-a-ocultar").style.display = "none";
    }
    
  • Si los iframes no tienen idy quieres ocultar el cuarto, podrías hacer algo como esto:

    document.querySelectorAll("iframe")[3].style.display = "none";
    

    o esto:

    // CUIDADO: los contadores de nth-child empiezan en 1 en lugar de 0 :S
    document.querySelector("iframe:nth-child(4)").style.display = "none";
    

    lo que dejaría la función ocultar() así:

    function ocultar() {
        document.querySelectorAll("iframe")[3].style.display = "none";
    }
    
3
  • muchas gracias alvaro ya eh podido resolver una parte del problema, solo que ahora no se a que motivo se deba de que lo oculta y todo es correcto lo hizo como quería, pero el problema es que cuando de en cierta opción de mi menú debería de volverlo a habilitar y eh ahí el nuevo problema ya que cuando le digo que lo vuelva aparecer lo puse dentro de un alert y me marca como undefinied el frame numero tres dentro de mi archivo de javascript, ya que de ahi hago todos los movimientos y pues solo lo oculta sin poder volverlo aparecer
    – David
    Commented el 20 jul. 2016 a las 21:21
  • @David ¿Puedes compartir en la pregunta el código de cómo lo escondes y lo muestras?¿Te aparece algún error en la consola de JS?
    – Alvaro Montoro
    Commented el 20 jul. 2016 a las 21:22
  • ya hice la edicion
    – David
    Commented el 20 jul. 2016 a las 21:39

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.