Menú desplegable con + y - KompoZer
Resuelto
Isobel
-
RAD ZONE Mensajes publicados 5362 Estado Colaborador -
RAD ZONE Mensajes publicados 5362 Estado Colaborador -
Hola,
Me gustaría crear un menú desplegable en mi sitio, pero no con una barra de desplazamiento. Quisiera que se pueda hacer clic en mi enlace, que el texto se despliegue abajo y que se pueda volver a comprimir a gusto. Como con los + y -. No sé si soy claro/a.
¿Cómo hacerlo?
Gracias de antemano.
Me gustaría crear un menú desplegable en mi sitio, pero no con una barra de desplazamiento. Quisiera que se pueda hacer clic en mi enlace, que el texto se despliegue abajo y que se pueda volver a comprimir a gusto. Como con los + y -. No sé si soy claro/a.
¿Cómo hacerlo?
Gracias de antemano.
3 respuestas
-
hola
aquí tienes una solución para adaptar a lo que quieres, ¡pero es el principio!!
https://forums.commentcamarche.net/forum/affich-6822882-texte-deroulant#6
o en CSS puro !
ejemplo<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title> Horizontal </title> <style type="text/css"> /*<![CDATA[*/ body{ margin:10px; padding:0; font-family:Arial,Helvetica,sans-serif } #dropdown{ margin:0; padding:0px; list-style:none; background:url(images/bg.gif) repeat-x top; height:28px; width:99%; border:solid 1px #c93300; border-width:1px 1px 1px 0; background-color: #FF9900 } #dropdown li{ display:inline; position:relative; float:left } #dropdown li a{ display:block; float:left; height:29px; line-height:29px; padding:0 25px; text-decoration:none; color:#fff; font-weight:normal; font-size:12px; border-left:solid 1px #c93300 } #dropdown li a:hover{ color:#a9401b; background:#fff } #dropdown li ul{ margin:0; padding:0 5px; line-height:none; position:absolute; top:29px; left:0; border:solid 1px #c93300; border-width:0px 1px 1px 1px; width:180px; display:none; background:#fff } #dropdown li:hover ul{ display:block } #dropdown li:hover a{ color:#a9401b; background:#fff } #dropdown li ul li{ display:block; border-bottom:solid 1px #dbdcd9; width:100%; background:url(images/arrow.gif) no-repeat 3px 12px; padding:0 0 0 10px } #dropdown li ul li:last-child{ border-bottom:0px } #dropdown li ul a{ border-width:0px; color:#909090; padding:0 5px 0 0; background-color:transparent } #dropdown li:hover ul li a{ color:#909090 } #dropdown li ul li a:hover{ color:#a9401b } /*]]>*/ </style> </head> <body> <ul id="dropdown"> <li> <a href="#" title="horizontal css menu">horizontal css menu</a> <ul> <li> <a href="#">sub menu</a> </li> <li> <a href="#">sub menu</a> </li> <li> <a href="#">sub menu</a> </li> <li> <a href="#">sub menu</a> </li> </ul> </li> <li> <a href="#" title="css menu">css menu</a> <ul> <li> <a href="#">sub menu</a> </li> <li> <a href="#">sub menu</a> </li> <li> <a href="#">sub menu</a> </li> <li> <a href="#">sub menu</a> </li> </ul> </li> <li> <a href="#" title="only css menu">css menu</a> <ul> <li> <a href="#">sub menu</a> </li> <li> <a href="#">sub menu</a> </li> <li> <a href="#">sub menu</a> </li> <li> <a href="#">sub menu</a> </li> </ul> </li> <li> <a href="#" title="css menu">css menu</a> </li> </ul> </body> </html>
a+
? La plus grande erreur que puisse faire un homme est d'avoir peur d'en faire une. ? -
Ups, respondí en el enlace que me diste...
¡Es exactamente lo que buscaba!
¡Muchas, muchas gracias! Que tengas una muy buena noche. -
Zona Rad, por si acaso pasas por aquí...
Tengo un pequeño problema. Usé el que me diste en el enlace, lo adapté con mi texto, pero no logro pegar los diferentes textos uno tras otro sin que los textos “se anulen” entre sí. No sé muy bien cómo explicarlo...
De hecho, retomé exactamente lo que tú creaste y quería copiarlo y pegarlo seguido para solo reemplazar el texto cada vez, pero no funciona.
¡Ayuda!