Hola querido foro, les cuento que estoy trancada con la creación de un popup, que quiero se abra desde una imagen. El pop que sea simple y que abra en toda la pagina para poder agregar otros links y que el usuario pueda seleccionar.
El código que tengo donde esta la imagen en el footer es el siguiente:
Código PHP:
</div>
<div class="footer" id="footer">
<div class="footer_item" style="border-right: 2px solid rgb(232, 232, 232);">
<a href="https://www.sitio.com/">
<img class="img_footer" src="https://www.misitio.com/icon/icono_chat.svg" width="35" height="35" alt="">
</a> <br>
<a href="#" class="link_footer">Abril</a>
</div>
El codigo para el popup es
PHP:
Código PHP:
<script type="text/javascript">
<!--
function popup(url)
{
params = 'width='+screen.width;
params += ', height='+screen.height;
params += ', top=0, left=0'
params += ', fullscreen=yes';
newwin=window.open(url,'windowname4', params);
if (window.focus) {newwin.focus()}
return false;
}
// -->
</script>
<a href="javascript: void(0)"
onclick="popup('popup.html')">Fullscreen popup window</a>
Y el Css
CSS:
Código PHP:
@charset "utf-8";
.overlay {
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: rgba(0, 0, 0, 0.7);
transition: opacity 500ms;
visibility: hidden;
opacity: 0;
}
.overlay:target {
visibility: visible;
opacity: 1;
}
#popupBody{
width: 46%;
padding: 2%;
border-radius: 15px;
box-shadow: 0 0 5px #CCC;
background: #FFF;
position: relative;
transition: all 5s ease-in-out;
margin: 20% auto;
}
#cerrar{
position: absolute;
top: 20px;
right: 30px;
transition: all 200ms;
font-size: 30px;
font-weight: bold;
text-decoration: none;
color: #F00;
}
No se donde colocar el código para que abra el pop!