Ir al contenido principal

Entradas

Mostrando entradas de septiembre, 2012

ventana modal con html, css y jQuery

   Intentaré explicar cómo crear, sólo con CSS , HTML y un poco de jQuery , un tipo de esas ventanitas que no nos permiten pinchar fuera de ellas hasta que las cerremos. Con que hechéis un vistazo al post anterior ya está más de la mitad del trabajo hecho. En dicho post ya expliqué cómo crear la ventana (un div oculto), posicionarla y darle forma con css y abrirla y cerrarla con jQuery, pero, ¿cómo evitar que se pinche fuera de ella?. Lo más sencillo que he encontrado para ello es lo siguiente: (la ventana a abrir será el formulario de correo que comenté en el post anterior el cual os aconsejo tenerlo abierto) Colocar el siguiente div en el html de nuestra página: <div id="fondoformulario"></div> cuyo css será el siguiente: #fondoformulario {     position:absolute;     top:0px;     left:0px;     width:100%; /*ocupará todo el ancho de nuestra página*/     height:1860px; /*le damos el alto de nuestra página*/     display:none; /*en principio será oc

Abrir y cerrar formulario de correo en ventana tipo popup con jquery

   Este post está relacionado con el anterior sobre enviar formulario de correo en segundo plano , en este voy a hablar sobre como abrir un div que contiene un formulario de correo, tipo popup o, tal vez mejor, ventana modal . En esta página sobre taller del automóvil tengo un formulario de correo oculto que se muestra al pinchar en un enlace. Intento minimizar el scroll de la página para mostrar la información. Me parece que es mejor mostrar toda la información posible moviendo la barra del scroll lo menos posible. Y, en este caso, me parecía que incluir un formulario visible recargaría demasiado la página. Voy a intentar explicar cómo mostrar y ocultar una ventana, que contiene un formulario de correo, usando jQuery .    Primero, el código CSS: /*damos forma y posición al div formulario que, por defecto, estará oculto*/  #formulario{     display:none;     position:absolute;     top: 50%;     left: 30%;     height:500px;     width:450px;     padding:0px 20px 0px 20px;     bac

Formulario de correo y su envío mediante jQuery y PHP en segundo plano.

   Tanto en esta página de excavaciones y movimientos de tierra , como en esta otra de mecánica de coches , existen sendos formularios para el envío de un correo desde la página web. La única diferencia es que en la segunda, el formulario no está visible (por falta de espacio) y hay que abrirlo mediante el enlace (esto está explicado en este otro post ). Es bueno tener un formulario para el envío de correo ya que facilita las cosas al posible cliente (que puede no tener un cliente de correo instalado, por ejemplo).    En este post voy a tratar de explicar cómo hacer un formulario de correo sencillo y, en segundo plano , tratarlo con jQuery y enviarlo con PHP . Lo normal es que, al enviar directamente el contenido del formulario al archivo PHP que lo procesa y envía, se abra una ventana en blanco. Si lo enviamos con el método que voy a explicar a continuación, no se abrirá dicha ventana.    Lo primero el formulario en HTML: <form id="myForm" action="enviarcorr