Haber por partes, queres quitarle la opacidad? comentado las lineas...
$('#open').click(function(){
...
/* $('body').css('opacity', '0.5'); */
...
});
$('#close').click(function(){
...
/* $('body').css('opacity', '1'); */
...
});
Si queres cambiar el color de fondo del pop-up podes hacerlo con css.. te combiene tambien definir alto y ancho del popup.
#popup {
...
background-color: #999999;
width: 400px;
height: 300px;
margin-left: 50px; /* Utiliza margin-left,-right, -top, -bottom para posicionar el popup por la pantalla */
margin-top: 0px;
...
}
.close { /* Mostrar la X en la parte superior a la derecha */
position: absolute;
top: 0;
right: 0;
}
"...el cual cuando se pinche afuera de la imagen se vaya a la pagina en la que estaba o dándole a la X.."
Esta es una forma de hacerlo, pero lo bueno es que si haces click dentro del contenedor popup no desaparece.
$(document).ready(function(){
//Codigo
});
$(document).mouseup(function (event)
{
var container = $("#popup");
if (!container.is(event.target) // if the target of the click isn't the container...
&& container.has(event.target).length === 0) // ... nor a descendant of the container
{
$('#popup').fadeOut('slow');
}
});
"..Y se le doy a enviar me lleva a otra pagina dando la enhorabuena por el registro..."
Podes utilizar la funcion propia de javascript window.location.replace al hacer click sobre el boton del fomulario.
// Al hacer click sobre el boton del formulario...
window.location.replace("http://misitio.com"); // Redireccionarlo al aviso 'enhorabuena por el registro!' ;)
Tambien si queres seguir con jquery podes cambiar todo el contenido del popup.
$(document).ready(function(){
...
$('.cambiarTexto').click(function(){
var nuevoContenido = 'Enhorabuena por el registro.!';
if ($('#popup').is(':visible')) {
$('#popup .content-popup').html(nuevoContenido);
};
});
...
});
<div class="content-popup">
Mostrar Mensajes
