PDA

View Full Version : PopUp Site



MuSoul
01/02/2019, 09:03 PM
Alguem teria o codigo de algum popup para website

cwF
03/02/2019, 02:04 PM
Alguem teria o codigo de algum popup para website

O PopUp é algo simples de fazer, vou te mandar aqui um exemplo:

Código HTML (insira antes do fechamento da tag </body> ou logo após a abertura desta tag):


<div class="popup">
<div class="close-button">✖</div>
<img src="[Only registered and activated users can see links]">
</div>


Código CSS (insira em um arquivo .css já setado ou dentro da tag <head> dentro da tag <style></style>):


<style type="text/css">
.popup{
width: auto;
height: auto;
position: absolute;
z-index: 999999;
left: 35%;
top: 15%;
background-color: transparent;
border-radius: 10px;
}
.close-button{
text-align: right;
color: red;
cursor: pointer;
font-size: 24px;
}
</style>


Código JS (insira em um arquivo js já setado ou dentro da tag <head> dentro da tag <script></script>):


<script type="text/javascript">
$(document).ready(function () {
$('.close-button').click(function(){
$('.popup').hide('slow');
});
});
</script>


Lembrando que você precisa do jquery para esse código funcionar, para isso basta inserir a tag <script> abaixo, dentro da tag <head>:


<script src="[Only registered and activated users can see links]" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abt TE1Pi6jizo" crossorigin="anonymous"></script>


Qualquer dúvida ou problema estaremos ai para ajudar-lo!

@Edit

Ele ficará assim: [Only registered and activated users can see links]

Caso queira posiciona-lo de uma forma diferente, basta mexer no top/left do código css.