Sílvio Garbes Lara

Pop-up não bloqueável com CSS e JAVASCRIPT

http://www.revistaphp.com.br/artigo.php?id=170

Olá amigos, os comentários estão no código.

Nosso JavaScript

Continuando nosso HTML

HTML

<html>
<title></title>
<style type="text/css">
#popup{
position: absolute;
top: 30%;
left: 30%;
width: 300px;
height: 150px;
padding: 20px 20px 20px 20px;
border-width: 2px;
border-style: solid;
background: #ffffa0;
display: none;
}
</style>
<body onLoad="javascript: abrir()">

www.revistaphp.com.br

JavaScript

<script language="javascript" type="">
// Função que fecha o pop-up ao clicar no link fechar
function fechar(){
document.getElementById('popup').style.display = 'none';
}
// Aqui definimos o tempo para fechar o pop-up
function abrir(){
document.getElementById('popup').style.display = 'block';
setTimeout ("fechar()", 3000);
}
</script>

www.revistaphp.com.br

HTML

<DIV id="popup" class="popup">
<b> APEDROSO.BLOGSPOT.COM </b>
<p>
Esse é um exemplo de popup utilizando DIV. Dessa maneira esse
pop-up não será bloqueado.
</p>
<p>
Andre Pedroso
</p>
<small><a href="javascript: fechar();">[X]</a></small>
</DIV>
<br> <a href="javascript: abrir();">Abrie POPUP</a>
<br> <a href="javascript: fechar();">Fechar POPUP</a>
</body>
</html>

www.revistaphp.com.br

Abraço

Andre Pedroso

Page updated

Google Sites

Report abuse