Botón aparecer y desaparecer

ananda · #1 (**permalink**) 02/04/2012, 09:54

Hola, tengo un problema y es que he creado un boton que al apretarlo la clase de un div cambia y se vuelve visible ese div y en chrome y en ie funciona pero en mozilla no entiendo porque no funciona, os dejo el código :

Ese es el registro, en un principio solo hay un boton que pone registro y después al darle salen los inputs (supuestamente):

Código PHP:

  <body> 
<form action="creausuarios.php" method="post" name="perfil"> 
<input type="button" id="registro" name="registro" value="Registro" class="botonregistro" onclick="javascript:formulariodiv.className='mostrar';" /> 
 
<div id="formulariodiv" class="no"> 
<input type="text" maxlength="20" id="name" name="name" value="Nombre" class="input" onclick="if(this.value=='Nombre') this.value=''" onblur="if(this.value=='') this.value='Nombre'" /><br/> 
<input type="text" maxlength="20" id="surname" name="surname" value="Apellidos" class="input" onclick="if(this.value=='Apellidos') this.value=''" onblur="if(this.value=='') this.value='Apellidos'" /><br/> 
<input type="text" maxlength="60" value="Correo electrónico" id="correo" name="correo" class="input" onclick="if(this.value=='Correo electrónico') this.value=''" onblur="if(this.value=='') this.value='Correo electrónico'" /><br/> 
<input type="password" maxlength="30" value="Contraseña" class="input" id="contraseña" name="contraseña"  onclick="if(this.value=='Contraseña') this.value=''" onblur="if(this.value=='') this.value='Contraseña'" /><br/> 
<input type="submit" value="" class="botonsubmit" /> 
</div> 
 
</form> 
</body>

y este es el css:

Código PHP:

  body { 
background-image:url('fondo.png'); 
} 
 
.no{ 
display:none; 
} 
 
.mostrar{ 
display:block; 
position:fixed; 
top:180px; 
left:250px; 
} 
 
.botonsubmit{ 
background-image:url('botonreg.png'); 
width:76px; 
height:24px; 
} 
 
.botonregistro{ 
position:fixed; 
top:180px; 
left:33px; 
font-family:calibri bold; 
font-size:20px;     
text-align:left; 
background-color:#91DBFF; 
border-color:blue; 
border-width:3px; 
border-width:3px; 
width:141px; 
height:39px; 
} 
 
.input { 
background-color:#91DBFF; 
font-family:calibri bold; 
font-size:15; 
color:black; 
height:30px; 
width:200px; 
border-color:blue; 
border-width:2px; 
border-width:2px; 
} 
 
.input:hover{ 
background-color:white; 
} 
 
.submit{ 
position:fixed; 
top:150px; 
right:230px; 
background-color:black; 
font-family:Amperzand; 
font-size:18px; 
color:#FFC90E; 
width:100px; 
height:27px; 
font-size: 
} 
 
 
.cuadrosocial 
{ 
position:fixed; 
top:200px; 
right:880px; 
width:438px; 
height:527px; 
border:solid:2px 2px 2px 2px; 
color:#FFC90E; 
background:none; 
}

Si supieráis porque ocurre esto os estaria muy agradecido, lo que me extraña a mi es que funcione en ie y en chrome pero no en mozilla y le he pasado el W3C validator y el codigo es correcto, muchas gracias a todos por la ayuda.

JavierB · #2 (**permalink**) 02/04/2012, 10:17

Hola ananda

Prueba poniendo:

Código Javascript:

Ver originalonclick="document.formulariodiv.className='mostrar';"

Saludos,

Bugger · #3 (**permalink**) 02/04/2012, 10:17

Hola ananda,

he probado tú código en Firefox y funciona correctamente!

aparte de la corrección de JavierB

http://i39.tinypic.com/65dhee.png

mira que no tengas nada en caché o en todo caso eliminala -> shift+ctrl +supr

saludos

ananda · #4 (**permalink**) 02/04/2012, 11:02

Hola, primero de todo muchas gracias a los dos, ya he sacado lo de javascript pero todavía me sigue sin funcionar, no sé si será por el dominio o el hosting, podeis entrar en la pagina y decirme si os va bien?

http:skyshallow.atwebpages.com/profile.php

Muchas gracias.

JavierB · #5 (**permalink**) 02/04/2012, 11:12

Perdón, ha sido un despiste mío. Tendrías que poner:

Código Javascript:

Ver originalonclick="document.getElementById('formulariodiv').className='mostrar';"

Saludos,

ananda · #6 (**permalink**) 02/04/2012, 11:17

Muchisimas gracias ya me ha funcionado y no me pidas perdón Javier, encima que me ayudas!
Gracias a los dos :)