menu Desplegable con Fireworks

il_tone · #1 (**permalink**) 10/10/2008, 13:36

resulta que hice el menu despegable en fireworks y lo exporte a dreamweaver. El tema es el siguiente: El menu con lo valores que puse se ve bien con resolución de 1024*768. Ahora bien si alguien usa otra resolución el menu al desplegarse aparece fuera del área de la página. ¿Hay algo que se puede hacer o eso pasa si o si al usar un menu desplegable?

gracias.
Carlos

juaniquillo · #2 (**permalink**) 11/10/2008, 10:11

puede que sea un problema de posicionamiento absoluto. ¿tienes algún enlace donde podamos mirar la página?

il_tone · #3 (**permalink**) 11/10/2008, 18:30

www.fundacionsinapsis.org.ar

es un sitio simple creado por mis propias manos de lo que aprendi.

Miralo en varias resoluciones para ver lo que digo y si es posible realizar algo para corregir eso con el programa que uso o no.

gracias por la ayuda

juaniquillo · #4 (**permalink**) 11/10/2008, 21:34

Pues era lo que sospechaba. tu menú tiene muchos problemas de posicionamiento. estos menús de FF funcionan bien cuando no se centralizan los contenedores. Te sugiero que hagas uno spry ya que es mas fácil de 'costumizar', pero si quieres arreglar este has lo siguiente:

Pon un div con el siguiente estilo al rededor de lo que tienes en el body, osea, el primer tag antes después de el del comienzo del body y el segundo antes del final del body, así:

Código css:

Ver originalposition:relative;width:640px;margin:0 auto;

osea, que al fina quedará asá:

Código html:

Ver original<!--esto ya lo tienes tienes-->
<body onload="MM_preloadImages('Botones/div_quienessomos_f2.jpg','Botones/div_quehacemos_f2.jpg','Botones/div_comoparticipar_f2.jpg','Botones/div_contacto_f2.jpg')">
<!--pones este div nuevo-->
<div style="position:relative;width:640px;margin:0 auto;">
<!--todo el contenido que tienes-->
<!--cierras el div-->
</div>
<!--esto ya lo tienes tienes-->
</body>

Esto lo que hace es que encierra todo tu contenido dentro de un div con posición relativa, lo pone del tamaño de tu contenido y lo pone en el centro. Después tienes que cambiar las posiciones de los contenedores div que contienen los menús secundarios. Ve a la hoja de estilo de los botones:
Botones/fireworks.css

Tienes que cambiar los siguientes estilos:

Código css:

Ver original#MMMenuContainer0711143819_0 {
/* This ID is related to the master menu div for menu MMMenuContainer0711143819_0 and contains the important positioning information for the menu as a whole */
    position:absolute;
    left:212px;
    top:190px;
    visibility:hidden;
    z-index:300;
}
#MMMenuContainer0711145001_1 {
/* This ID is related to the master menu div for menu MMMenuContainer0711145001_1 and contains the important positioning information for the menu as a whole */
    position:absolute;
    left:372px;
    top:190px;
    visibility:hidden;
    z-index:300;
}
#MMMenuContainer0711145241_2 {
/* This ID is related to the master menu div for menu MMMenuContainer0711145241_2 and contains the important positioning information for the menu as a whole */
    position:absolute;
    left:532px;
    top:190px;
    visibility:hidden;
    z-index:300;
}

A todos cambiales el 'top' a 184px, mas o menos. Puedes jugar con ese valor. El 'left' en todos es diferente. A '#MMMenuContainer0711143819_0' le das 0px o 2px si lo quieres un poco separado del borde. A los otros dostienes que darle un valor de menos pixeles. Yo les di el valor de 162px y 324px respectivamente, pero tú ya sabrás como te gusta mas.

Me dejas saber si tienes algún problema. Saludos.

il_tone · #5 (**permalink**) 12/10/2008, 09:23

Gracias capo, me diste una gran gran ayuda. Ahora a seguir aprendiendo. Esa página si viste es de una fundación que arme y como el diseño web esta caro, decide a aprender lo básico para ir armando. Dentro de todo esta bastante bien, pero vamoss a ir mejorandola.

Gracias de nuevo.

juaniquillo · #6 (**permalink**) 12/10/2008, 10:36

me alegro haberte ayudado. saludos.

il_tone · #7 (**permalink**) 12/10/2008, 12:23

Juaniquillo, te quería consultar ya que estamos: en el archivo de css del menu, hay algun lugar para achicar el largo del primer submenu que se desplega.

O sea, que no sea tan larga la barra azul si las palabras no ocupan tanto (al principio entraba justo, pero despues retoque una palabra y ahora es como que queda muy extenso para el contenido) Quisiera que quede como los otros 2 donde es largo como la palabra mas larga.

Si no me explique bien avisame si tenes tiempo para ver este temita, sino no hay drama total lo más importante era lo que me solucionaste que ya lo colgué o sea en horas seguro que se arregla y todo el mundo va a poder ver bien eso.

gracias.

juaniquillo · #8 (**permalink**) 12/10/2008, 15:08

para eso tienes que cambiar el ancho de los los divs, en este caso los que terminan en '_0' los cuales son los del primer menú. El ancho actual es 183px. Puedes darle menos, no se, 140px. son los que dicen:

width:183px;

Tienes que tener en cuenta que el el tamaño de la imagen de fondo es 183px así que se vera cortada a la derecha. Tendrías que hacer una nueva imagen para ese fondo con el tamaño que hayas elegido.

il_tone · #9 (**permalink**) 12/10/2008, 17:38

Se agradece.