0

Este es el html que quiero llamar dentro del iframe. Como ven, es un dropdown dentro de una lista que hará de header en varias paginas.

<!DOCTYPE html>
<html>
<head>
    <title>Janfa</title>
    <link rel="stylesheet" type="text/css" href="css/Dropdown.css">
    <link rel="stylesheet" type="text/css" href="css/header.css">
</head>
<body>
    <ul>
        <li>
            <div class="dropdown">
                <button class="dropdown-btn">
                    <i class="material-icons md-light">menu</i>
                </button>
                <div class="dropdown-content">
                    <a href="#">Link 1</a>
                    <a href="#">Link 2</a>
                    <a href="#">Link 3</a>
                </div>
            </div>
        </li>
        <li><span>Janfa</span></li>
        <li class="login"><a href="">Log in</a></li>
    </ul>

</body>
</html>

El siguiente es el html en donde tengo el iframe:

<!DOCTYPE html>
<html>
<head>
    <title>Janfa</title>
    <link rel="stylesheet" type="text/css" href="main.css">
    <link rel="stylesheet" type="text/css" href="css/Index.css">
</head>
<body>
    <iframe src="header.html"></iframe>

</body>
</html>

y este es el CSS del html index

body{
    background-color: #eee;
    margin: 0;
}

iframe{
    width: 100%;
    height: 59px;
    border-style: none;
    position: relative;
}

El iframe se muestra perfectamente pero al activar el menu desplegable las opciones quedan ocultas dentro del margen del iframe y no se muestran (no adjunto el css del dropdown para no hacer la pregunta demasiado larga. Pero si, si sirve) solo que no se muestra completo cuando lo invoco por medio de el iframe. Alguna sugerencia?

1 respuesta 1

1

La solución que me funcionó en una situacion como la que planteas fue hacerlo alrevez, la pagina contiene el menu desplagable y en el iframe incruste las paginas, para ello utilice javascript reemplazando los href="#" por onclick( a la funcion de cambio de pagina). No olvides de agregar un id a tu iframe para poder capturarlo con getElementByID(el id ).src=(nueva pagina)

1

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.