O código abaixo mostra como criar uma janela pop-up baseada em CSS, que torna-se visível quando uma função em JavaScript altera o atributo display e uma DIV é exibida por cima da página. Por não precisar abrir uma nova janela ou aba, o código na realidade não gera um pop-up, e sim uma parte do código-fonte, que estava oculta pelo estilo CSS display:none;.

<!DOCTYPE html>
<html lang="pt-br">

<head>
  <title>Exibindo pop-up na página HTML</title>

  <style type="text/css">
  .popup{
     position: fixed;
     top: 0; bottom: 0;
     left: 0; right: 0;
     margin: auto;
     width: 300px;
     height: 150px;
     padding: 20px;
     border: solid 1px #331;
     background: #ffffd0;
     display: none;
  }
  </style>

  <script type="text/javascript">

   function fechar(){
     document.getElementById('popup').style.display = 'none';
   }

   function abrir(){
     document.getElementById('popup').style.display = 'block';
     setTimeout ("fechar()", 3000);
   }

  </script>

</head>

<body>

   <DIV id="popup" class="popup"> 
     <p>Conteúdo do pop-up aqui.</p>
     <p><small class="fechar"><a href="javascript: fechar();">Fechar pop-up</a></small></p>
   </DIV>

   <p><a href="javascript: abrir();">Abrir POPUP</a>
      <a href="javascript: fechar();">Fechar POPUP</a></p>

</body>

</html>

A propriedade CSS position:fixed manterá o conteúdo pop-up sempre visível, mesmo que o usuário role a página. O conteúdo é ocultado e omitido do processamento da página na linha diplay:none, que não serve apenas para ocultar o pop-up, mas garante que ele não afete o layout da página.

O programa javascript tem duas funções. A função fechar apenas retorna o pop-up ao seu estado original aplicando novamente o estilo CSS display:none;. A função abrir faz o inverso: muda a propriedade display para block, tornando o pop-up visível. Adicionalmente, coloquei um timeout na função que faz com que a função fechar() seja chamada após 3 segundo (3000 porque o tempo é passado em milissegundos).