Alguem teria o codigo de algum popup para website
Printable View
Alguem teria o codigo de algum popup para website
O PopUp é algo simples de fazer, vou te mandar aqui um exemplo:Citação:
Originally Posted by bruninho [Only registered and activated users can see links. Click Here To Register...]
Código HTML (insira antes do fechamento da tag </body> ou logo após a abertura desta tag):
Código CSS (insira em um arquivo .css já setado ou dentro da tag <head> dentro da tag <style></style>):Código:<div class="popup">
<div class="close-button">✖</div>
<img src="https://pbs.twimg.com/profile_images/541064181668405248/99fVUMJq_400x400.jpeg">
</div>
Código JS (insira em um arquivo js já setado ou dentro da tag <head> dentro da tag <script></script>):Código:<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>
Lembrando que você precisa do jquery para esse código funcionar, para isso basta inserir a tag <script> abaixo, dentro da tag <head>:Código:<script type="text/javascript">
$(document).ready(function () {
$('.close-button').click(function(){
$('.popup').hide('slow');
});
});
</script>
Qualquer dúvida ou problema estaremos ai para ajudar-lo!Código:<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
@Edit
Ele ficará assim: [Only registered and activated users can see links. Click Here To Register...]
Caso queira posiciona-lo de uma forma diferente, basta mexer no top/left do código css.