Tengo un error extraño que no encuentro solución. Tengo un div como enlace para abrir otro div que contiene un formulario. Lo extraño es que la primera vez que se carga la página debo hacer doble clic sobre dicho enlace, pero a partir de ese momento con hacer un simple clic (lo que debería ser normal) cierro o abro el otro div del formulario. ¿A qué puede ser debido el error para hacer necesario, la primera vez, el realizar doble clic sobre el enlace?
Os copio el código para ver si me pudierais ayudar:
HTML:
<div id="Formulario">
<div id="contFormulario"></div></div>
<div id="abrirCerrar2"></div>
<div id="abrirFormulario"><img src="../images/sobre.png" /></div>
<div id="abrirCerrar3"></div>
JS:
$(document).ready(function()
{
$("#abrirFormulario").click( function()
{
if ($("#abrirCerrar2").is(":hidden"))
{
$("#contFormulario").animate(
{
marginLeft: "35%"
}, 2000);
$("#abrirCerrar2").show();
}
else
{
$("#contFormulario").animate(
{
marginLeft: "60.8%"
}, 2000 );
$("#abrirCerrar2").hide();
}
if ($("#abrirCerrar3").is(":hidden"))
{
$("#abrirFormulario").animate(
{
marginLeft: "31.45%"
}, 2000);
$("#abrirCerrar3").show();
}
else
{
$("#abrirFormulario").animate(
{
marginLeft: "57.25%"
}, 2000 );
$("#abrirCerrar3").hide();
}
});});
CSS:
#contFormulario
{
float:left;}
clear: left;
margin-top: 8.8em;
margin-left: 60.8%;
width: 20em;
max-width: 25%;
height: 19.2em;
background-color: #424242;
-moz-border-radius: 2em 0em 0em 4em;
border-radius: 2em 0em 0em 4em;
-webkit-border-radius: 2em 0em 0em 4em;
behavior: url(ie-css3.htc);
border-style: solid;
border-color: #3299bb;
color: #bcbcbc;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-box-sizing: border-box;
position: absolute;
#abrirFormulario
{
float:left;}
clear: left;
margin-top: 16.8em;
margin-left: 57.25%;
width: 3em;
max-width: 25%;
height: 3.2em;
background-color: #424242;
-moz-border-radius: 0.8em 0em 0em 1.6em;
border-radius: 0.8em 0em 0em 1.6em;
-webkit-border-radius: 0.8em 0em 0em 1.6em;
behavior: url(ie-css3.htc);
border-left-style: solid;
border-top-style: solid;
border-bottom-style: solid;
border-left-color: #3299bb;
border-top-color: #3299bb;
border-bottom-color: #3299bb;
color: #bcbcbc;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-box-sizing: border-box;
position: absolute;
#abrirFormulario:hover
{
background-color: #3299bb;}
cursor: pointer;
Espero que me podais ayudar, gracias a todos!!!
