Menú desplegable dinámico

albertogarci86 · #1 (**permalink**) 06/06/2011, 10:00

Buenas tardes,

He construido un código para formar un menú en forma de lista:

TITULO 1
SubTitulo1.1
SubTitulo2.1
SubTitulo3.1
TITULO2
Subtitulo2.1

No soy muy experto en HTML y CSS y me gustaría saber como adaptar el código para que dicho menú sea desplegable, dinámico e interpretable por todos los navegadores.

El código que tengo actualmente es:

<p style="font-family: 'Lucida Sans', Arial, Verdana, Helvetica; font-size: 11px; line-height: 15px; color: #ffffff; margin-top: 0px; margin-right: 0px; margin-bottom: 6px; margin-left: 0px; padding-left: 30px;"><a href="TITULO1">TITULO1</a>

<p style="font-family: 'Lucida Sans', Arial, Verdana, Helvetica; font-size: 11px; line-height: 15px; color: #ffffff; margin-top: 0px; margin-right: 0px; margin-bottom: 6px; margin-left: 0px; padding-left: 60px;"><a href="Subtitulo1.1">SUBTITULO1.1</a>

<p style="font-family: 'Lucida Sans', Arial, Verdana, Helvetica; font-size: 11px; line-height: 15px; color: #ffffff; margin-top: 0px; margin-right: 0px; margin-bottom: 6px; margin-left: 0px; padding-left: 60px;"><a href="SUBTITULO2.1">SUBTITULO2.1</a>

<p style="font-family: 'Lucida Sans', Arial, Verdana, Helvetica; font-size: 11px; line-height: 15px; color: #ffffff; margin-top: 0px; margin-right: 0px; margin-bottom: 6px; margin-left: 0px; padding-left: 60px;"><a href="TITULO2">TITULO2</a>

¿Qué debo añadir para llegar al resutado deseado?
¡¡¡Muchas gracias por adelantado!!!

ArturoGallegos · #2 (**permalink**) 06/06/2011, 11:35

Aquí te dejo link a varios ejemplos de menús desplegables css tanto verticales como horizontales...
->clic aquí

por cierto con HTML no se pueden hacer menús dinámicos, necesitaras hacerlo con php + mysql

albertogarci86 · #3 (**permalink**) 07/06/2011, 11:58

Cita:

Iniciado por Ag666

Aquí te dejo link a varios ejemplos de menús desplegables css tanto verticales como horizontales...
->clic aquí

por cierto con HTML no se pueden hacer menús dinámicos, necesitaras hacerlo con php + mysql

Gracias por tu ayuda.
De los que me has pasado me gusta el ejemplo 5, es el que necesito.

¿No puedo hacer menus desplegables con el código que he pasado?

He estado echando un vistazo a tu código, ¿cuál es la parte del código en la que utilizas la propiedad de menu desplegable?

La parte de código comentada, ¿para qué sirve?

Muchas gracias

ArturoGallegos · #4 (**permalink**) 07/06/2011, 12:10

me da gusto que encuentres uno de tu agrado y la propiedad :hover es la que hace al menú desplegable...

estudialo detenidamente todo el código es parte del menú ya que solo eso se encuentra en las paginas.

por otro lado no he de atribuirme los créditos por esos menús... son aporte del compañero @Mikmoro

---------------------------------------
Nota: al decir que no podías hacer menús dinámicos con html + css me refería a que no se construyen solos, cada que agregues una nueva pagina o le cambies de nombre tendrás que ir a editar cada pagina donde se encuentre el menú.

albertogarci86 · #5 (**permalink**) 08/06/2011, 04:26

Cita:

Iniciado por Ag666

me da gusto que encuentres uno de tu agrado y la propiedad :hover es la que hace al menú desplegable...

estudialo detenidamente todo el código es parte del menú ya que solo eso se encuentra en las paginas.

por otro lado no he de atribuirme los créditos por esos menús... son aporte del compañero @Mikmoro

---------------------------------------
Nota: al decir que no podías hacer menús dinámicos con html + css me refería a que no se construyen solos, cada que agregues una nueva pagina o le cambies de nombre tendrás que ir a editar cada pagina donde se encuentre el menú.

Muchas gracias por la info. y la rapidez en contestar.

Solo una cosita que se nos ha quedado en el camino.
La parte comentada, ¿sabes para que sirve?

Un saludo

ArturoGallegos · #6 (**permalink**) 08/06/2011, 07:42

la parte comentada es para que funcione en IE6, si no vas a dar soporte a ese navegador lo puedes retirar con toda confianza, en lo personal ya pocas veces se da soporte salvo que el cliente lo solicite explícitamente.

albertogarci86 · #7 (**permalink**) 09/06/2011, 11:03

OK,
muchas gracias.

Una última duda ya que me esta quedando un menú muy a mi gusto. Escogí el tipo 5 de los que me mandaste:

OPCION1
Opcion1.1
Opcion1.2
Opcion1.3

El problema es que cuando hago clic en una opción del segundo nivel, por ejemplo Opcion1.1, el menú se me vuelve a plegar y no me enlaza con la url específicada en el href.
¿Cómo puedo hacer para que enlace y con la url y el menú siga desplegado?
¿Tiene que ver con las propiedades (hover display:block)?

Con esto ya tendría todo perfecto.

Muchas gracias por tu ayuda.

albertogarci86 · #8 (**permalink**) 09/06/2011, 11:04

Cita:

Iniciado por Ag666

la parte comentada es para que funcione en IE6, si no vas a dar soporte a ese navegador lo puedes retirar con toda confianza, en lo personal ya pocas veces se da soporte salvo que el cliente lo solicite explícitamente.

OK,
muchas gracias.

Una última duda ya que me esta quedando un menú muy a mi gusto. Escogí el tipo 5 de los que me mandaste:

OPCION1
Opcion1.1
Opcion1.2
Opcion1.3

El problema es que cuando hago clic en una opción del segundo nivel, por ejemplo Opcion1.1, el menú se me vuelve a plegar y no me enlaza con la url específicada en el href.
¿Cómo puedo hacer para que enlace y con la url y el menú siga desplegado?
¿Tiene que ver con las propiedades (hover display:block)?

Con esto ya tendría todo perfecto.

Muchas gracias por tu ayuda.

albertogarci86 · #9 (**permalink**) 09/06/2011, 11:20

Disculpa, desde Firefox me funciona pero desde Safari me ocurre lo que te he comentado...

En Internet Explorer 8 no me funcionan bien los desplegables...