Foros del Web » Creando para Internet » Sistemas de gestión de contenidos » Joomla »

[SOLUCIONADO] Problema con menú desplegable

Estas en el tema de Problema con menú desplegable en el foro de Joomla en Foros del Web. Hola amigos de forosdelweb, tengo un problema en una página web hecha en joomla de un conocido, al parecer el menú desplegable no se abre ...
  #1 (permalink)  
Antiguo 09/05/2013, 09:40
 
Fecha de Ingreso: febrero-2008
Mensajes: 83
Antigüedad: 10 años, 9 meses
Puntos: 5
Pregunta Problema con menú desplegable

Hola amigos de forosdelweb, tengo un problema en una página web hecha en joomla de un conocido, al parecer el menú desplegable no se abre solo al cargar la página, el caso es que no tengo ni idea de joomla y no se que puede ser, alguno de vosotros podría decirme ?

La web es http://lasedenoche.com/

PD: Veréis si ponéis el ratón encima de agencia por ejemplo, justo al cargar la página se abrirá el desplegable pero una vez ha cargado desapatrece :S

, saludos y gracias.
  #2 (permalink)  
Antiguo 09/05/2013, 15:55
Avatar de alberto510a  
Fecha de Ingreso: abril-2013
Mensajes: 351
Antigüedad: 5 años, 7 meses
Puntos: 35
Respuesta: Problema con menú desplegable

Hola.

Me baso en Agencia para mostrarte el error con los demás solo tendrás que hacer lo mismo.

Código actual:

Código:
<a href="/agencia/viajes.html" class="first-item" id="menu169">
<span>VIAJES</span></a>
<ul style="width: 0px; left: -999em;">
Código correcto:

Código:
<a href="/agencia/viajes.html" class="first-item" id="menu169">
<span>VIAJES</span></a>
<ul style="width: 0px;">

Como ves el error está en el estilo de las listas ya que tienen la propiedad left:-999em; y esto hace que te aparezca muy alejado el menú solo deberás borrarlo y ya irá bien.

Aquí te dejo una captura del menú funcionando con la página cargada:



(http://img41.imageshack.us/img41/4223/sinttulogqf.png)

Saludos, si tienes alguna duda más avísame!
  #3 (permalink)  
Antiguo 10/05/2013, 02:16
 
Fecha de Ingreso: febrero-2008
Mensajes: 83
Antigüedad: 10 años, 9 meses
Puntos: 5
Respuesta: Problema con menú desplegable

Hola Alberto, gracias por tu pronta respuesta. Sabes exactamente donde debo editar eso ? En la admin de joomla donde se editan los enlaces del menú no da opción de ese código, solo título y enlace, luego en la hoja de estilos del tema tampoco aparece, creo que podría ser algún tipo de módulo o algo, podrías indicarme con más exactitud ? Esta tontería me está volviendo loco :S

, saludos y gracias.
  #4 (permalink)  
Antiguo 10/05/2013, 08:48
Avatar de alberto510a  
Fecha de Ingreso: abril-2013
Mensajes: 351
Antigüedad: 5 años, 7 meses
Puntos: 35
Respuesta: Problema con menú desplegable

Esto creo que depende de la versión de tu joomla pero mas o menos es igual en todos.

Tendrás que ir al gestor de plantillas pulsar en la tuya y ahí te saldrán todos los archivos que configuran a tu plantilla. Por alguno de esos archivos debe estar eso que hace.

Saludos
  #5 (permalink)  
Antiguo 11/05/2013, 02:16
 
Fecha de Ingreso: febrero-2008
Mensajes: 83
Antigüedad: 10 años, 9 meses
Puntos: 5
Respuesta: Problema con menú desplegable

Lo voy a dejar por imposible al final :( He editado todos los archivos posibles de la plantilla quitando eso que dices y no hay modo de solucionar el error :`(
  #6 (permalink)  
Antiguo 13/05/2013, 02:26
 
Fecha de Ingreso: febrero-2008
Mensajes: 83
Antigüedad: 10 años, 9 meses
Puntos: 5
Respuesta: Problema con menú desplegable

No existe la posiblidad que pueda ser otra cosa ? Es importante reparar la web por favor ...

, saludos y gracias.
  #7 (permalink)  
Antiguo 13/05/2013, 10:51
Avatar de alberto510a  
Fecha de Ingreso: abril-2013
Mensajes: 351
Antigüedad: 5 años, 7 meses
Puntos: 35
Respuesta: Problema con menú desplegable

Puedes intentar hacer esto:

Código CSS:
Ver original
  1. .menuhor ul {
  2. left:0em !important;
  3. }

Así todas las listas dentro de esa clase cogerían ese estilo.

Saludos.

PD: Probé en tu css eso que te dije y ya me cogió el estilo para todos y me ha funcionado perfectamente, así que tan solo tendrías que llegar al archivo .css que arriba te expliqué como hacerlo.
  #8 (permalink)  
Antiguo 13/05/2013, 11:11
 
Fecha de Ingreso: febrero-2008
Mensajes: 83
Antigüedad: 10 años, 9 meses
Puntos: 5
Respuesta: Problema con menú desplegable

gracias por tu respuesta alberto, en que parte tendría que colocar exactamente eso del css ?

, gracias.
  #9 (permalink)  
Antiguo 13/05/2013, 11:14
Avatar de alberto510a  
Fecha de Ingreso: abril-2013
Mensajes: 351
Antigüedad: 5 años, 7 meses
Puntos: 35
Respuesta: Problema con menú desplegable

Tendrás que ir al gestor de plantillas pulsar en la tuya y ahí te saldrán todos los archivos que configuran a tu plantilla. Si no me equivoco tu archivo de css se debe llamar template.css según ví, lo clickas y añades esas líneas que te puse.
  #10 (permalink)  
Antiguo 13/05/2013, 11:17
 
Fecha de Ingreso: febrero-2008
Mensajes: 83
Antigüedad: 10 años, 9 meses
Puntos: 5
Respuesta: Problema con menú desplegable

Lo he colocado al principio del archivo template.css de esa plantilla y el único cambio que he apreciado es que al cargar la web aparecen todos los desplegables del meú a la vez pero luego cuando ha cargado vuelve la web igual...

Otra idea ?

Muchas gracias por tu ayuda alberto
  #11 (permalink)  
Antiguo 13/05/2013, 11:19
Avatar de alberto510a  
Fecha de Ingreso: abril-2013
Mensajes: 351
Antigüedad: 5 años, 7 meses
Puntos: 35
Respuesta: Problema con menú desplegable

¿Podrías mandarme una captura de pantalla de como lo colocaste para que así pueda ver como lo pusiste y dónde?

Saludos.
  #12 (permalink)  
Antiguo 13/05/2013, 11:28
 
Fecha de Ingreso: febrero-2008
Mensajes: 83
Antigüedad: 10 años, 9 meses
Puntos: 5
Respuesta: Problema con menú desplegable

Claro, aquí la tienes.

  #13 (permalink)  
Antiguo 13/05/2013, 14:47
Avatar de alberto510a  
Fecha de Ingreso: abril-2013
Mensajes: 351
Antigüedad: 5 años, 7 meses
Puntos: 35
Respuesta: Problema con menú desplegable

A ver es que viene bastante mezclado el código de esa plantilla. Ahora haz esto:

Código CSS:
Ver original
  1. #topnav ul li ul {display:none}
  2. #topnav ul li ul:hover{display:block}

La primera id ya esta creada tan solo tienes que buscarla y agregarle ese atributo. La 2º línea la copias tal cual.
  #14 (permalink)  
Antiguo 13/05/2013, 15:01
 
Fecha de Ingreso: febrero-2008
Mensajes: 83
Antigüedad: 10 años, 9 meses
Puntos: 5
Respuesta: Problema con menú desplegable

No se exactamente lo que quieres decir, aquí te dejo el template.css.
Cita:
/*****************************/
/*** Core html setup stuff ***/
/*****************************/

html {
height: 100%;
margin-bottom: 1px;
}

form {
display:inline;
}

body {
margin: 0px 0px 0px 0px;
width: 100%;
display: table;
background:url(../images/bg_page.png) top repeat-x #FFE382;
}

body, td{
font-family: "Trebuchet MS";
font-size: 13px;
color: #ACACAC;
line-height: 1.3em;
}

a:link, a:visited {
text-decoration: none;
font-weight: normal;
}

a:hover {
text-decoration: underline;
font-weight: normal;
}

input.button { cursor: pointer; }

p { margin-top: 0; margin-bottom: 5px; }

img { border: 0 none; margin:0px; }

/*****************************************/
/*** Template specific layout elements ***/
/*****************************************/
#page_bg {
padding: 0px;
margin: 0px;
margin-bottom: 0px;
background: #202020 url(../images/bg_page.png) center repeat-y;
}

div#top_menu{
height:54px;
margin:0px auto;
width: 978px;
}

#topnav{ height: 54px; width:978px; margin: 0px; padding:0px; font-weight: bold; }
#topnav ul { margin: 0px 0px 0px 11px; padding: 0; width: auto; float: left; list-style-type:none; }
#topnav ul li{ margin: 0; padding: 0; height: 54px; float: left; position: relative; }
#topnav ul li a{ color: #FFFFFF; font-weight: bold; text-decoration: none; padding: 14px 10px 0px 10px; height:40px; display: block; float: left; }
#topnav ul li a:hover{ background-color: #444444; text-decoration: none; font-weight: bold; color: #fff; }
#topnav ul li ul ul { margin: -50px 0 0 297px; z-index: 100; }
#topnav ul li li { width:auto; height: 35px; }
#topnav ul li li a { color: #000000; text-transform: none; display: block; background: none; width: 277px; border-top: 1px solid #DDDDDD; border-left: 0px; padding: 9px 10px 6px 10px; height:20px; }
#topnav ul li li a:hover{ background: none; background-color: #333333; left: 0; width: 277px; padding: 9px 10px 6px 10px; height:20px; border-top: 1px solid #DDDDDD; }
#topnav ul li ul {top: 54px; left: 0; display: block; height: 36px; width: 277px; position: absolute; z-index: 99; clear: left; margin-top: 0px; margin-left: 0px; }
#topnav ul li:hover ul ul, #topnav ul li:hover ul ul ul { }
#topnav ul li:hover ul, #topnav ul li li:hover ul, #topnav ul li li li:hover ul { left: auto; }

div#main_bg{
margin:0px auto;
width: 978px;
text-align:left;
}

div.banner1{
background: url(../images/banner1.jpg) top center no-repeat;
}

div#h_area{
margin:0px auto;
width: 964px;
height:250px;
text-align:left;
padding-left:14px;
padding-top:10px;
}


.logo{
display: block;
float:left;
padding-top:5px;
margin-bottom:10px;
margin-left:10px;
width:600px;
}
a.logo,a.logo:link,a.logo:hover, a.logo:visited{
font-size:26px;
line-height: 58px;
color:#FFFFFF;
text-decoration:none;
font-weight:bold;
font-family:"Trebuchet MS",Arial;
}

div#user4{
float:right;
text-align:left;
margin-right: 20px;
}

div#user4 div.search{
width:220px;
height:46px;
text-align:left;
padding-top: 5px;
background: url(../images/search_bg.gif) top left no-repeat;
}
div#user4 div.search .inputbox {
background:#FFFFFF;
width: 150px;
height: 16px;
margin-left: 60px;
font-size: 11px;
color: #454545;
padding:5px 2px 2px 2px;
border: 1px solid #D3D3D3;
}

div#main_top table.contentpaneopen{
padding:0px;
margin-top:55px;
margin-left:12px;
width:400px;
height:149px;
overflow: auto;
text-align:left;
color:#FFFFFF;
float:left;
}
div#main_top table.contentpaneopen td{
color:#FFFFFF;
}

.search {
text-align:left;
width: 156px;
height:43px;
}
.search .inputbox {
background:#FFFFFF;
width: 156px;
height: 17px;
font-size: 11px;
color: #454545;
margin:9px 0px 0px 20px;
border: 1px solid #D3D3D3;
}


#leftcolumn{
margin-left:9px;
padding:0px;
width:205px;
float:left;
}
#rightcolumn{
margin-right:9px;
padding:0px;
width:205px;
float:right;
}

#maincolumn{
width:530px;
float:left;
margin:0px 5px 0px 5px;
padding:0px;
overflow:hidden;
}
#maincolumn_middle{
width: 740px;
float:left;
margin:0px 5px 0px 5px;
padding:0px;
overflow:hidden;
}
#maincolumn_big{
width: 967px;
float:left;
margin:0px 5px 0px 5px;
padding:0px;
overflow:hidden;
}

div.path{
margin:10px 0 0 0px;
padding: 5px;
}

div.nopad {
float:left;
padding:0 0px 15px 0px;
}

div.nopad ul {
clear: both;
}
.article_separator {
height:35px;
line-height:35px;
}
form#form-login fieldset {
border: none;
margin: 0;
margin-left:10px;
}
form#form-login ul li{
padding: 0;
}

form#form-login ul li a {
text-align: left;
padding: 0px;
font-size: 10px;
color: #858585;
}

#leftcolumn div.module_menu, #leftcolumn div.module{
margin: 10px 0px 0px 0px;
padding:0px;
width: 205px;
}
.article_column {
padding-right:10px;
}
#rightcolumn div.moduletable_menu, #rightcolumn div.moduletable, #rightcolumn div.moduletable_text{
margin: 10px 0px 0px 0px;
padding: 0px;
width: 205px;
}
div.bannergroup_text {
margin:0px 13px 15px 13px;
}
.bannerheader {
font-weight:bold;
margin-bottom:10px;
}
.banneritem_text {
margin-bottom:10px;
}
.bannerfooter_text {
margin-bottom:10px;
}
#leftcolumn div.module_menu div div div, #leftcolumn div.module div div div,
#rightcolumn div.moduletable_menu, #rightcolumn div.moduletable, #rightcolumn div.moduletable_text{
background: url(../images/rub_bottom.png) center bottom no-repeat;
}
#leftcolumn div.module_menu div div div, #leftcolumn div.module div div{
margin: 0px;
padding: 0px;
padding-bottom:5px;
width: 205px;
height:auto;
}

#leftcolumn div.module_menu div div div div, #leftcolumn div.module div div div div{
background: none;
padding:4px 8px;
}
#leftcolumn h3,
#rightcolumn h3{
text-align: left;
padding-left:15px;
height: 42px;
width: 190px;
line-height: 40px;
color:#FFFFFF;
font-size:16px;
margin:0px;
font-weight:bold;
}
table.poll thead td {
text-align: left;
padding-left:10px;
}
table.poll td {
text-align: left;
}
#leftcolumn ul.menu li ul{
list-style: none;
}
.pollstableborder {
margin: 5px 0px 10px 0px;
}
.poll td div{
display:inline;
}

/* forms */

#leftcolumn .moduletable ul,
#rightcolumn .moduletable ul {
margin: 6px 0;
padding: 0;
list-style: none;
}

#leftcolumn .moduletable ul li,
#rightcolumn .moduletable ul li {
margin: 0;
padding: 0 2px;
}
.moduletable ul {
padding:5px 10px 5px 12px;
margin:0px;
}

.moduletable ul li {
padding:0px 10px 5px 15px;
margin:0px;
line-height:18px;
}
#leftcolumn ul.menu li#current ul li,
#rightcolumn ul.menu li#current ul li {
margin: 0px;
padding: 0px;
}
ul.menu {
padding:5px 10px 5px 12px;
margin:0px;
}
ul.menu li{
padding:0px 10px 5px 15px;
margin:0px;
}

ul.menu li ul {
padding:0px 0px 5px 0px;
margin:0px;
}
ul.menu li ul li{
padding:0px 0px 0px 15px;
border:none;
}
ul.menu li#current ul li a{
margin-left:15px;
text-decoration:none;
}
ul.mostread {
padding:5px 10px 5px 12px;
margin:0px;
}
ul.mostread li{
padding:0px 10px 5px 15px;
margin:0px;
line-height:18px;
}
ul.latestnews {
padding:5px 10px 5px 12px;
margin:0px;
}
ul.latestnews li{
padding:0px 10px 5px 15px;
margin:0px;
line-height:18px;
}
div.componentheading{
font-size:16px;
font-size:19px;
margin:7px auto;
}
td.contentheading{
font-weight:normal;
vertical-align:top;
font-size:19px;
height:30px;
color:#9E9E9B;
background: url(../images/contentheading_ico.png) left top no-repeat;
}
table.contentpaneopen td.contentheading{
padding-left:34px;
}
table.contentpaneopen{
border-collapse: collapse;
margin-left:5px;
}
td.buttonheading{
padding:0px 2px 0px 2px;
}
table.contentpaneopen td{
padding:0px;
}
.contentpaneopen p{
line-height:22px;
}
span.small, td.createdate, td.modifydate{
font-size:11px;
color:#FFFFFF;
}
span.pagination span, span.pagination a{
padding:5px;
}



div#f_area{
background: url(../images/f_area_bg.png) top center no-repeat;
margin:0px auto;
width: 978px;
text-align:left;
margin-bottom:3px;
}
#f_area div.moduletable, #f_area div.moduletable_menu{
float: left;
margin:20px 4px 10px 6px;
width: 234px;
}
#f_area h3{
text-align:center;
vertical-align:bottom;
height: 30px;
width: 234px;
color:#FFFFFF;
font-size:17px;
font-family:"Trebuchet MS", Tahoma, Verdana;
margin:0px;
padding-top:20px;
}

.menuhor ul {
left:0em !important;
}


/* System Standard Messages */
#system-message { margin-bottom: 20px; }

#system-message dd.message ul { background: #C3D2E5 url(../../system/images/notice-info.png) 4px center no-repeat;}

/* System Error Messages */
#system-message dd.error ul { color: #c00; background: #E6C0C0 url(../../system/images/notice-alert.png) 4px center no-repeat; border-top: 3px solid #DE7A7B; border-bottom: 3px solid #DE7A7B; margin:0px; padding-left: 40px; text-indent:0px;}

/* System Notice Messages */
#system-message dd.notice ul { color: #c00; background: #EFE7B8 url(../../system/images/notice-note.png) 4px center no-repeat; border-top: 3px solid #F0DC7E; border-bottom: 3px solid #F0DC7E;}

#syndicate{
float:left;
padding-left: 25px;
}
  #15 (permalink)  
Antiguo 14/05/2013, 08:29
 
Fecha de Ingreso: febrero-2008
Mensajes: 83
Antigüedad: 10 años, 9 meses
Puntos: 5
Respuesta: Problema con menú desplegable

Hola albrto, al parecer ahora ya si cargan, el problema que tengo ahora es que al cargar la web aparecen todos los menús, como podría hacerlo para que no aparecieran desplegados al cargar la web ?

Gracias por todo, me están siendo de gran ayuda :)
  #16 (permalink)  
Antiguo 14/05/2013, 08:52
Avatar de alberto510a  
Fecha de Ingreso: abril-2013
Mensajes: 351
Antigüedad: 5 años, 7 meses
Puntos: 35
Respuesta: Problema con menú desplegable

Hola.

Para arreglar eso tienes que hacer 2 cambios:

1º: Busca esta línea en el mismo archivo donde metiste lo otro que te dije (el mismo que me has copiado): #topnav ul li ul
2º: Esa línea tiene varios atributos css dentro de ella uno de ellos es display:block; cambialo por display:none;
3º: Crea esta nueva línea en cualquier sitio como ya hiciste anteriormente:
Código CSS:
Ver original
  1. #topnav ul li ul:hover {display:block;}
La copias tal cual en cualquier sitio como la otra vez y listo.

Saludos.
  #17 (permalink)  
Antiguo 14/05/2013, 10:30
 
Fecha de Ingreso: febrero-2008
Mensajes: 83
Antigüedad: 10 años, 9 meses
Puntos: 5
Respuesta: Problema con menú desplegable

Ahora a parte de aparecer, se queda fijo pero al pasar el ratón por encima desaparece, me tiene loco este menú !!!!
  #18 (permalink)  
Antiguo 14/05/2013, 10:40
Avatar de alberto510a  
Fecha de Ingreso: abril-2013
Mensajes: 351
Antigüedad: 5 años, 7 meses
Puntos: 35
Respuesta: Problema con menú desplegable

Te equivocas ahora ya esta corregido y no aparece al cargar la página abierto (si lo sigues viendo igual es que no borraste la caché del navegador) pero te faltó una línea y por eso no se despliega.

Busca esta línea:

#topnav ul li:hover ul, #topnav ul li li:hover ul, #topnav ul li li li:hover ul { left: auto; }

Y ponla así

#topnav ul li:hover ul, #topnav ul li li:hover ul, #topnav ul li li li:hover ul { left: auto; display:block; }

Tras esto borra cookies y caché de tu navegador (con este cerrado) y vuelve a abrir tu página.

Suerte!
  #19 (permalink)  
Antiguo 14/05/2013, 10:54
 
Fecha de Ingreso: febrero-2008
Mensajes: 83
Antigüedad: 10 años, 9 meses
Puntos: 5
Respuesta: Problema con menú desplegable

Yo no entiendo nada, ahora no aparece al cargar ni nada... Ya desisto ...
Cuanto me cobrarías por solucionarlo ? Ya me empieza a ser urgente porque el cliente se queja y no encuentro el modo :S
  #20 (permalink)  
Antiguo 14/05/2013, 11:01
Avatar de alberto510a  
Fecha de Ingreso: abril-2013
Mensajes: 351
Antigüedad: 5 años, 7 meses
Puntos: 35
Respuesta: Problema con menú desplegable

¿Tienes skype o sino hablamos por mensaje privado?
  #21 (permalink)  
Antiguo 14/05/2013, 11:08
Avatar de alberto510a  
Fecha de Ingreso: abril-2013
Mensajes: 351
Antigüedad: 5 años, 7 meses
Puntos: 35
Respuesta: Problema con menú desplegable

Edito: Funciona perfectamente como ya te dije anteriormente tan solo debes borrar la caché de tu navegador ya que sino lo haces las hojas de estilo se te guardan en la caché y aunque cierres en el navegador se conservan.

Saludos.
  #22 (permalink)  
Antiguo 14/05/2013, 12:26
 
Fecha de Ingreso: febrero-2008
Mensajes: 83
Antigüedad: 10 años, 9 meses
Puntos: 5
Respuesta: Problema con menú desplegable

Cierto!!!

Muchas gracias, eres un genio !!!

Mil gracias de verdad, no habría podido hacer nada sin ti :D
  #23 (permalink)  
Antiguo 14/05/2013, 12:29
Avatar de alberto510a  
Fecha de Ingreso: abril-2013
Mensajes: 351
Antigüedad: 5 años, 7 meses
Puntos: 35
Respuesta: Problema con menú desplegable

De nada para eso estamos ;)

Etiquetas: desplegable, página
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 02:42.