RE: [Ovillo] efecto en menu desplegable con css

2006-01-13 Por tema Hari Seldon 
Vamos a ver, esto está bastante bien descrito en el ejemplo de
HTMLDOG:

http://www.htmldog.com/articles/suckerfish/dropdowns/

Es necesario utilizar javascript porque IE -y algún otro
navegador..- no soportan el :hover en los LI y en otros tags.

http://www.meyerweb.com/eric/css/edge/menus/demo.html

En vez de utilizar javascript, se puede utilizar un behaviour para
CSS en IE, creo que el mejor es este:

http://www.xs4all.nl/~peterned/csshover.html

El problema que tiene este, es que los estilos del tipo:

li:hover > li

No le "gustan", y tienes que escribirlos así:

li:hover li

Con lo cuál hay veces que no hace el menú exactamente lo que
quieres.. Aunque jugando un poco con el !important en las reglas CSS
definidas, normalmente se suele solucionar.

Así mismo, tanto el jS como el behaviour se deben de incluir con un
comentario condicional de IE

http://msdn.microsoft.com/workshop/author/dhtml/overview/ccomment_ovw.asp

Espero os sea útil.

Un saludo.


 

> -Mensaje original-
> De: [EMAIL PROTECTED] 
> [mailto:[EMAIL PROTECTED] En nombre de "Choan 
> C. Gálvez"
> Enviado el: viernes, 13 de enero de 2006 10:17
> Para: Ovillo, la lista de CSS en castellano
> Asunto: Re: [Ovillo] efecto en menu desplegable con css
> 
> Fernando Graells escribió:
> > Yo estoy programando varias páginas utilizando un menú de este tipo.
> > La única opción es utilizar javascript para los navegadores 
> estandar FF
> > y Opera y un htc para internet explorer.
> 
> ¿Por qué? ¿Acaso Internet Explorer no soporta javascript?
> 
> > sfEls[i].onmouseover=function() {
> > this.className+=" sfhover";
> > }
> > sfEls[i].onmouseout=function() {
> > this.className=this.className.replace(new
> > RegExp(" sfhover\\b"), "");
> > }
> 
> Cuidadín con esto que no siempre va a funcionar, algunos 
> navegadores (no 
> recuerdo cuales) se "comen" el espacio (el de `" sfhover"`) 
> al añadirlo 
> a un `className` vacío. Tampoco estoy muy convencido de que 
> esa RE sea 
> correcta.
> 
> Para añadir/quitar nombres de clase, te recomiendo utilizar algo 
> parecido a `toggleClassName` [1].
> 
> Por otra parte, cuidado con sobrescribir manejadores ya definidos.
> 
> [1]: 
> http://lists.scriptia.net/pipermail/javaescript-scriptia.net/2
005-November/38.html 
> (tirando pa' bajo)
> 
> Salud,
> Choan
> 
> ___
> Lista de distribución Ovillo
> Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
> Puedes modificar tus datos o desuscribirte en la siguiente 
> dirección: http://ovillo.org/mailman/listinfo/ovillo

___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://ovillo.org/mailman/listinfo/ovillo

Re: [Ovillo] efecto en menu desplegable con css

2006-01-13 Por tema Choan C. Gálvez 

Fernando Graells escribió:

Yo estoy programando varias páginas utilizando un menú de este tipo.
La única opción es utilizar javascript para los navegadores estandar FF
y Opera y un htc para internet explorer.


¿Por qué? ¿Acaso Internet Explorer no soporta javascript?


sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new
RegExp(" sfhover\\b"), "");
}


Cuidadín con esto que no siempre va a funcionar, algunos navegadores (no 
recuerdo cuales) se "comen" el espacio (el de `" sfhover"`) al añadirlo 
a un `className` vacío. Tampoco estoy muy convencido de que esa RE sea 
correcta.


Para añadir/quitar nombres de clase, te recomiendo utilizar algo 
parecido a `toggleClassName` [1].


Por otra parte, cuidado con sobrescribir manejadores ya definidos.

[1]: 
http://lists.scriptia.net/pipermail/javaescript-scriptia.net/2005-November/38.html 
(tirando pa' bajo)


Salud,
Choan

___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://ovillo.org/mailman/listinfo/ovillo

Re: [Ovillo] efecto en menu desplegable con css

2006-01-11 Por tema stripTM 

Renso Vargas escribió:

Estoy construyendo un menu desplegable con CSS y me he enfrentado al 
siguiente requerimiento:


Cuando se seleccione una opcion y se desplieguen sus subOpciones al 
seleccionar una de estas subopciones la opcion padre debe seguir con 
el efecto del rollover. bien sea un cambio de color o un cambio de 
imagen (espero ser claro). he buscado varias de formas de hacerlo y 
parece q la solucion es javascript.


Pues si, si no hay carga de una nueva página la solución pasa por 
javascript ya que únicamente con css no vas a poder controlar los 
estados en los que se encuentra cada elemento. Y ojo con la 
accesibilidad, comprueba que sin javascript se puedan llegar a todos los 
sitios ;-)


--
Saludos -=stripTM=-

___
Lista de distribución Ovillo
Para escribir a la lista, envia un correo a Ovillo@lists.ovillo.org
Puedes modificar tus datos o desuscribirte en la siguiente dirección: 
http://ovillo.org/mailman/listinfo/ovillo