Janela Pop Up CSS e HTML

Ir em baixo

Janela Pop Up CSS e HTML

Mensagem  marcio em Dom Ago 12, 2018 11:13 pm

Segue o código abaixo para criar a janela popup css+html

<html>
<head>
<title>Imagem Pop Up</title>
</head>
<body>
<style>
*{
margin: 0;
padding: 0;
}
#bg{
width: 100%;
height: 100%
top: 0;
left 0;
background-color: rgba(0,0,0,.Cool;
position: fixed;
display: none;
}
#bg:target{
display: block;
}
#bg:target ~ .box{
top:150px;
transition: all .3s;
transition-delay: .2s;
}
.box{
width: 550px;
height: 550px;
position: absolute;
margin-left: - 225px;
left: 50%;
top:-910px;
}
.box img{
width: 100%;
position: absolute;
}
#close{
color: #fff;
font-family: 'Arial';
text-decoration: none;
font-size: 35px;
position: absolute;
background-color: #000;
width: 40px;
height: 40px;
text-align: center;
right: 0;
}
#close:hover{
opacity: .6;
}
</style>
<a href="#bg">teste</a>
<div id="bg"></div>
<div class="box">
<a href="https://go.hotmart.com/X8220117L?src=banner" target="_blank"><img src="https://i.imgur.com/LsPN85h.gif"></a>
<a href="" id="close">X</a>
</div>
</body>
</html>


www.mfsite.com.br | www.caricaturadefotos.com.br
What a Face

marcio

Mensagens : 139
Data de inscrição : 08/05/2010

Ver perfil do usuário

Voltar ao Topo Ir em baixo

Voltar ao Topo

- Tópicos similares

 
Permissão deste fórum:
Você não pode responder aos tópicos neste fórum