como q eu faço pra dpois q a div aparecer no meio da pagina ... o redor ficar com uma cor de fundo transparente ?!!
ja tenho esse code
<script>
function abrir(){
var a = document.getElementById('d1');
a.style.visibility = 'visible';
}
function fechar(){
var a = document.getElementById('d1');
a.style.visibility = 'hidden';
}
</script>
<style type="text/css">
.popup{
position:absolute;
width:643px;
height:348px;
left: 180px;
background-color:#999999;
visibility:hidden;
top: 57px;
border:solid 2px #666;
}
</style>
<html>
<head>
</head>
<body>
<div class='popup' id=d1>
<a href='#' onclick=fechar();>[X]</a>
</div>
<input type=button onclick=abrir(); value=ABRIR />
<table width="700" height="100%" border="0" align="center" cellpadding="0" cellspacing="10" bgcolor="#FFFFFF">
<tr>
<td id="TITULO"><strong><font size="2">TEXTOS</font></strong></td>
</tr>
<tr>
<td valign="top" id="CONTEUDO">
<h1><div id="DATA">01/01/2001</div>
<div id="NOME">TITULO</div>
</h1>
<div id="SCORE">10</div>
<div id="VIEWS">50</div>
<div id="TEXTOS">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Fusce congue. Proin justo mi, convallis quis, ornare a, malesuada ut, dui.
Pellentesque vel eros. Cras aliquam. Proin id nibh a velit ultricies congue. Etiam massa ligula, pellentesque eu, gravida eu, mollis ut, pede. Donec
aliquet eros eget metus. Etiam scelerisque tristique sapien. Phasellus egestas pede quis augue commodo ultricies. Duis erat. Nullam aliquet urna quis
dolor. Fusce placerat pulvinar mauris. Vestibulum sit amet ante. Maecenas feugiat diam eu purus. Duis ac nulla adipiscing dui bibendum pulvinar. In
ante pede, tempor at, porta vitae, vehicula id, leo.
<p>Aliquam varius, lorem vitae rhoncus sodales, magna arcu aliquet velit, non ultricies justo lorem a sem. Ut vel justo. Vivamus a erat a libero rutrum
scelerisque. Pellentesque eu enim. Maecenas sagittis, ante non vehicula vulputate, velit lacus condimentum sem, ut porta magna ipsum id dolor. Morbi
varius dignissim nulla. Vestibulum rutrum tincidunt elit. Vivamus sapien. Morbi at sem ut dolor congue tempor. Nulla ornare, lectus ac tincidunt
aliquet, tellus mi vulputate nibh, ac egestas dui justo quis felis. Cras ac nisi a nulla ullamcorper interdum. Vestibulum a urna vel nibh gravida
consectetuer. Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</p>
<p>Duis commodo orci. Quisque et mi congue risus nonummy tincidunt. Integer luctus turpis. Nunc rhoncus nisl ac nisl. Nulla bibendum arcu nec est
sodales porta. Proin at lorem. Nulla id risus. Quisque et erat. Proin consequat laoreet leo. Morbi vitae risus. Ut justo erat, tempor ac, auctor
at, consectetuer venenatis, dolor.</p>
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Lorem ipsum dolor sit amet, consectetuer adipiscing
elit. Curabitur pede dui, tristique a, blandit suscipit, viverra et, eros. Aenean interdum lacus a nisi. Nullam sit amet tellus. Sed porta, ligula
vel luctus gravida, dui quam ultricies nisi, a tincidunt ante eros et nisi. Ut est tellus, dapibus iaculis, sollicitudin vitae, placerat quis, tellus.
Quisque nec eros eget arcu tempus scelerisque. Aenean tristique lorem ac ligula. Mauris porta nisi ac felis. Donec tempor accumsan mauris. Fusce
metus neque, iaculis nec, rutrum ac, bibendum a, est. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
Quisque malesuada. Vestibulum eu odio. Nulla placerat, elit ac feugiat elementum, mauris tellus accumsan risus, et tincidunt nisl dui quis dui.
Quisque porta, nibh et varius ultrices, libero nisl porta mi, quis consectetuer dui lorem eu quam. Sed ut velit ut felis sodales luctus. </p>
<p>Cras arcu nisl, porta non, dignissim in, scelerisque malesuada, eros. Nullam id augue. Donec venenatis. Vestibulum nibh risus, volutpat ut, tempor
nec, placerat nec, tellus. Donec nisi massa, imperdiet vel, sagittis ut, scelerisque ac, leo. Duis sapien sapien, vehicula sit amet, imperdiet pretium,
elementum nec, orci. Nulla libero. Aenean accumsan ante in est. Mauris vehicula dolor at purus sollicitudin molestie. Donec mattis, velit a viverra
dignissim, urna lacus semper ipsum, sed aliquam dui elit a nisi. Duis a nisl. Quisque eget ligula ut massa suscipit tristique.</p>
</div> </td>
</tr>
</table>
</body>
</html>valeu
