JavaScript - Mouse Over

   
Vista:

Mouse Over

Publicado por Laura (1 intervención) el 18/12/2007 13:00:28
Hola. Quiero cambiar el estilo de un botón cuando paso por encima de el el raton. Se que hay que escribirlo en el evento onMouseOver, pero no se muy bien lo que hay que pone. Mi boton es

<p><div align = center><INPUT TYPE="Submit" VALUE="Continuar"
style="BORDER: rgb(128,128,128) 1px solid; FONT-SIZE: 16pt; FONT-FAMILY: Verdana;
BACKGROUND-COLOR: rgb(233,233,233)"onMouseOver=" ; return true"
onMouseOut ="return true"></div></p>

Y quiero que al pasar el raton por encima el color de rellendo del boton cambie. Un saludo.Gracias
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder

RE:Mouse Over

Publicado por Lord Sairtanikvs (20 intervenciones) el 26/12/2007 15:09:16
Desde mi punto de vista la mejor forma de hacer esto es con css, en lugar de javascript. Al hacerlo con css, el navegador se encarga de todo.

Lo unico que tendrias que hacer seria poner un id, a tu boton.

<INPUT TYPE="Submit" VALUE="Continuar" ID="subContinuar">

Luego añades el estilo, o bien en una hoja de estilos, o bien en el propio html donde tienes el boton.

Si va insertado en el html solo copia esto:
<style>
#subContinuar{
BORDER: rgb(128,128,128) 1px solid;
FONT-SIZE: 16pt;
FONT-FAMILY: Verdana;
BACKGROUND-COLOR: rgb(233,233,233);
}
#subContinuar:hover{
BACKGROUND-COLOR: rgb(203,203,203);
}
</style>
El problema de esto, es que el IE6 todavia no soporta ese estilo, pero a partir del 7 si que lo tiene integrado.

Para hacerlo con javascript tendrias que crear dos funciones que se encarguen de eso.
function nuevoColor(){
this.style.backgroundColor="#fdfdff";
}
function colorAnterior(){
this.style.backgroundColor="#343434";
}
Te recomiendo poner los colores en hexadecimal en javascript, ya que segun uses IE o mozilla no es lo mismo rgb(222,222,222) que rgb(222, 222, 222); y asi te ahorras una comprobacion.

Bueno, lo unico en este ultimo caso es llamar a una funcion en el onmouseover y a la otra en el onmouseout.

Suerte, y ya contaras si te vale.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar