Puzzle de eventos en un formulario

ThunderWolf · #1 (**permalink**) 10/10/2011, 13:43

Saludos.

Tengo un formulario, y en cada input de texto los siguientes eventos que cambian las clases de css:

- Onmouseover (clase 1)
- Onmouseout (clase 0)
- Onfocus (clase 2)
- Onblur (clase 0)

Sucede que el onmouseout hace las veces del onblur, es decir, aunque el input conserve el foco, si aparto el ratón retoma el diseño por defecto, y lo que pretendo es mientras tenga el foco activo use su diseño correspondiente (independientemente del los eventos del ratón).

¿De que manera puedo combinar esos cuatro eventos sin que los del ratón interfieran con los del foco?

Carlangueitor · #2 (**permalink**) 10/10/2011, 17:59

Se que este es el foro de Javascript, pero a mi parecer eso lo deberías hacer con CSS, tienes las pseudoclases :hover y :focus

Saludos

ThunderWolf · #3 (**permalink**) 11/10/2011, 00:55

Gracias, aún no conocía esto de las pseudoclases de css; he estado experimentando con ello y me va a venir fenomenal

Pero por desgracia el maldito IE solo las tolera con los links, aunque he indagado por google y hay un js llamado selectivizr para que funcionen también en ese "navegador".

Con eso son 4 kb adicionales de carga pero teniendo en cuenta lo que ahorraré en el html sin tener que especificar el diseño por cada elemento, me sale rentable.

Carlangueitor · #4 (**permalink**) 11/10/2011, 08:00

Puedes usar esas pseudoclases añadiendo display:block en Internet Explorer.

Saludos

ThunderWolf · #5 (**permalink**) 11/10/2011, 09:35

Gracias de nuevo; ahora funciona también en IE sin necesidad de scripts.

Me has resuelto el dilema y ademas podré recortar un peso considerable en el html al no tener que declarar todos los eventos por cada input.