Código:

<div class="popup" style="display: none;">Conteúdo</div><input type="button" onClick="$('.popup').fadeIn('slow');">

Código:

<script>
jQuery('#msg').hide();
function mostra(event){jQuery(event).fadeToggle();}
</script>
<center><div id="msg">CONTEÚDO DA POPUP</div></center><br>
<button onclick="mostra('#msg');">MOSTRAR/ESCONDER</button>

1. Link para abrir a popup
2. posição da popup no centro da tela, com fundo preto
3. botão x para fechar a popup

Código:

<a href="#" onclick="$('#funybox').slideDown();">Open the POP-UP</a>

Código:

<style>#funybox {background-color: rgba(0, 0, 0, 0.84);height: 100%;display: none;position: fixed;width: 100%;z-index: 999;}#loginbox {-moz-border-radius: 5px;-moz-box-shadow: 0 0 20px #222;-webkit-border-radius: 5px;-webkit-box-shadow: 0 0 20px #222;border-radius: 5px;box-shadow: 0 0 20px #222;font-family: Arial, tahoma, Sans-Serif;font-size: 13px;height: 220px;left: 42% !important;margin: -200px auto auto -300px !important;position: fixed;top: 50%!important;width: 800px;}.loginbox_content {-webkit-transition: 5s;background: #F8F8F8;height: 100%;width: 100%;}.loginbox_head {background: #EEE url(http://i.imgur.com/x1C6p.png) repeat-x 0 0;border-bottom: 1px solid #DDD;display: inline-block;height: 35px;line-height: 35px;vertical-align: middle;width: 100%;}.loginbox_head strong {padding-left: 20px;}.loginbox_head span a {-moz-border-radius: 4px;-webkit-border-radius: 4px;background: #999;border: 1px solid #777;border-radius: 2px;color: white;display: inline-block;float: right;font-weight: bolder;height: 16px;line-height: 14px;margin-right: 10px;margin-top: 7px;position: relative;text-align: center;width: 16px;}.loginbox_username {float: left;font-weight: 700;margin-top: 10px;padding: 10px 20px;width: 250px;}#quick_login_password, #quick_login_username {-moz-box-shadow: inset 0 2px 5px #f0f0f0;-moz-transition: .4s;-ms-transition: .4s;-o-transition: .4s;-webkit-box-shadow: inset 0 2px 5px #F0F0F0;-webkit-transition: .4s;background: #F9F9F9;border: 1px solid #CCC;box-shadow: inset 0 2px 5px #F0F0F0;font-size: 13px;margin: 5px 0;outline: 0;padding: 5px;transition: .4s;width: 260px;}.loginbox_password {float: right;margin-top: 10px;padding: 10px 40px 10px 0;width: 250px;}.loginbox_password label {font-weight: 700;}.forgot.right {float: right;position: relative;top: -65px;}.forgot.right a {color: #666;display: inline-block;font-size: 11px;position: relative;right: -25px;top: 2px;width: 120px;}.loginbox_submit {left: -273px;padding-left: 16px;position: relative;top: 72px;}.loginbox_submit label {margin-left: 5px;position: absolute;top: 0;}.loginbox_submit_button {float: right;margin-right: 20px;margin-top: 50px;position: absolute;right: 0;}#signin_submit_remember {-moz-border-radius: 2px;-moz-box-shadow: inset 0 0 2px #ccc;-moz-transition: 0.5s,box-shadow 0;-ms-transition: 0.5s,box-shadow 0;-o-transition: 0.5s,box-shadow 0;-webkit-border-radius: 2px;-webkit-box-shadow: inset 0 0 2px #CCC;-webkit-transition: 0.5s,box-shadow 0;background: #777 url(http://i.imgur.com/Db0w3.png) repeat-x;border: 1px solid #555;border-radius: 2px;box-shadow: inset 0 0 2px #CCC;color: white;cursor: pointer;padding: 10px 50px;transition: 0.5s,box-shadow 0;}</style><div id="funybox" style="top: 0%;"><div id="loginbox" class="window login_menu"><div class="loginbox_content"><div class="loginbox_head"><strong style="font-family: Century Gothic;font-weight: lighter;font-size: 14px;letter-spacing: 1.1px;">Título</strong><span class="fecha-funy"><a href="#" onclick="$('#funybox').slideUp();" title="Fechar">x</a></span></div><div class="gesc" style="text-align: center;display: block;padding-top: 12px;font-family: Century Gothic;font-size: 13px;font-weight: lighter;"><span>Conteúdo</span><br><br></div></div></div></div>