Navigation Multilevel [RESOLVIDO]

  • aconceicao
  • Avatar de aconceicao Autor do Tópico
  • Offline
  • JCB! Novato
  • JCB! Novato
Mais
12 anos 1 mês atrás #68324 por aconceicao
aconceicao created the topic: Navigation Multilevel [RESOLVIDO]
Olá pessoal do Clube, tudo bem?

Estou em um projeto com o Joomla 2.5, consegui formalizar toda estrutura do Menu, no caso o Menu Horizontal Superior (TopMenu), utilizando aqui uma estrutura com três níveis de subitens (SubMenu). Na configuração dos Itens do Menu em suas Categorias, tudo esta no conforme, o problema segue na visualização do nível 3 da navegação, não entendo o motivo, pois tudo esta corretamente setado, conforme abaixo:

Em "Basic Options":
Select Menu: Menu Horizontal
Start Level: 1
End Level: all
Show Sub-menu Items: Yes

Temos a seguir exemplos de estrutura:

A Corretora
(-)Certificacao
Produtos
(-)Consorcio
(-)(-)Automovel
Seguros
(-)Para SUA EMPRESA
(-)(-)Riscos Patrimoniais
(-)(-)(-)Buffets *

* - Subitens abaixo das subcategorias de "Para SUA EMPRESA" não surgem.

Endereço do projeto: http://www.clcorretora.com/projeto

Fico no aguardo da informação do erro ou bug do sistema e como corrigir tal erro.

Please Entrar ou Registrar to join the conversation.


  • aconceicao
  • Avatar de aconceicao Autor do Tópico
  • Offline
  • JCB! Novato
  • JCB! Novato
Mais
12 anos 1 mês atrás #68481 por aconceicao
aconceicao replied the topic: Re: Navigation Multilevel
Olá amigos do clube,

Agradeço imensamente o auxílio e suporte da equipe, após horas de trabalho e análise, localizei e solucionei o problema, restando apenas fazer algumas modificações de estilos, cores e fontes para adaptação do original. Tal erro foi detectado no CSS do Template "Elegance-FJT" desenvolvido para Joomla 2.5. O CSS não cria o 3º nível dropdown do Menu Horizontal.

Abaixo segue o CSS que corrigiu o problema reclamado:
#nav ul.menu li {background:none;}
#nav ul.menu > li,
#nav ul.menu ul > li {font-family: 'Bebas';color:#fff;text-decoration:none;padding:1px;}
#nav ul.menu ul > li {border-top:1px dashed #000;}
#nav ul.menu ul > li:hover {border:none;border-top:1px dashed #000;border-left:1px solid #000;border-right:1px solid #000;background:#53300C;}
#nav ul.menu ul > li.parent {}
#nav ul.menu ul > li.parent:hover {}
#nav ul.menu li > a {color:#fff;}
#nav ul.menu li > span {}
#nav ul.menu li:hover > span,
#nav ul.menu li:hover > a {text-decoration:none;}
#nav ul.menu > li.active ,
#nav ul.menu > li:hover,
#nav ul.menu > li.active ,
#nav ul.menu > li:hover {background:#53300C;text-decoration:none;border:1px solid #000000;padding:0;}
#nav ul.menu li ul {background:#47270A;}
#nav ul.menu li ul {border:1px solid #000;background:#47270A;}
#nav ul.menu li a {}
#nav ul {padding: 0;float: right;z-index:1000;}
#nav ul li {list-style:none;float:left;padding:0 3px;line-height:45px;position:relative;}
#nav ul.menu li a {display:block;padding:1px 16px;font-size:15px;margin-left:5px;}
#nav ul.menu ul li a {padding:1px 5px 1px 5px;}
#nav li ul {position:absolute;width:200px;top:-999em;left: auto;padding:0;margin:0;z-index:10;}
#nav li ul ul {margin: 0 0 0 -20px;z-index:10;}
#nav li:hover ul ul,
#nav li:hover ul ul ul,
#nav li:hover ul ul ul ul {top:-999em;left: auto;z-index:1000;}
#nav li li {margin: 0;margin-left:-1px;padding: 0 0 0 10px;height:auto;width:200px;background:none;z-index:1000;}
#nav li li a,
#nav li li.active a,
#nav li li a:hover,
#nav li li .separator,
#nav li li.active .separator {height: auto;float: none;width: auto;line-height:20px;display: block;padding:1px 16px;}
#nav li li a span,
#nav li li.active a span,
#nav li li a:hover span,
#nav li li .separator span,
#nav li li.active .separator span {width: auto;display: block;line-height: 20px;text-transform: none;padding: 5px 5px 5px 5px;}
#nav li li a,
#nav li.active li a,
#nav li li .separator,
#nav li.active li .separator {font-size:15px;word-spacing:3px;font-weight:normal;margin-right:17px;margin-left:5px;}
#nav li:hover ul {left: 0;top: 29px;}
#nav li li:hover ul,
#nav li li li:hover ul,
#nav li li li li:hover ul {left:220px;top: -1px;}
#nav ul.menu ul > li:hover {padding-left:0px;padding-right:0px;}

Grato,

Alexandre Conceição.

Please Entrar ou Registrar to join the conversation.

Mais
12 anos 1 mês atrás #68490 por rpolesi
rpolesi replied the topic: Re: Navigation Multilevel [RESOLVIDO]
aconceicao,

Em qual arquivo colocou esses códigos?

[color=#0000FF:1jvbs1b7][b:1jvbs1b7]Prof. Ms. Reginaldo Polesi[/b:1jvbs1b7][/color:1jvbs1b7]
Filosofia, Sociologia, História, Metodologia
[url:1jvbs1b7]http://www.rp71.com.br[/url:1jvbs1b7]

Please Entrar ou Registrar to join the conversation.

  • aconceicao
  • Avatar de aconceicao Autor do Tópico
  • Offline
  • JCB! Novato
  • JCB! Novato
Mais
12 anos 1 mês atrás #68497 por aconceicao
aconceicao replied the topic: Re: Navigation Multilevel [RESOLVIDO]
Olá Prof. Polesi,

O código foi substituído com as ID de navegação (#nav) definidos dentro do arquivo CSS do template, conforme a estrutura HTML que chama as IDs e Classes.

Caso tenha algum problema parecido, informe-o que tento ajuda-lo.

Att,

Alexandre Conceição.

Please Entrar ou Registrar to join the conversation.

Mais
12 anos 1 semana atrás #71145 por gustavobrcomputer
gustavobrcomputer replied the topic: Re: Navigation Multilevel [RESOLVIDO]
Olá Alexandre

Estava olhando sua dica e estou com o mesmo problema. Estou aprendendo e não tenho prática com programação. testei o seu código na minha folha de estilo e o menu funcionou como eu queria, só que o layout do meu menu mudou e estou com dificuldades de resolver. como posso ajustar o código abaixo, dentro do código que você enviou?
#nav {}
#navl {}
#navr {background: none;height:33px; background:url(../images/nav.jpg) 0 0 repeat-x}
#nav {z-index:10; position:relative;}
#nav ul {margin:0; padding:0; float:left;}
#nav ul li {list-style:none;float:left;height:33px;position:relative; padding:0; margin:0; border-right:1px solid #2B2B2B;}
#nav ul li a { display:block;padding:0 10px; margin:0;line-height:33px;color:#fff;font-weight:100;text-decoration:none;font-size:12px; text-shadow:1px 1px #000}
#nav ul li.active {}
#nav ul li.active a {color:#fff; background:url(../images/nav-a.jpg) 0 0 repeat-x}
#nav ul li:hover {}
#nav ul li a:hover{color:#fff;text-decoration:none;background:url(../images/nav-a.jpg) 0 0 repeat-x}
#nav ul li ul {position:absolute;width:180px;left:-999em;border-top:0; margin:0; padding:0;}
#nav ul li:hover ul, #menu ul li.sfHover ul {left:0;}
#nav ul li ul li {padding:0;height:auto;width:180px; margin:0; border:none;}
#nav ul li:hover ul li a {text-shadow:none;}
#nav ul li:hover ul li { background:none;}
#nav ul li:hover ul li a, #nav ul li ul li a, #nav ul li.active ul li a{margin:0; padding:0 0 0 10px;height:24px;line-height:24px; background:#484848;border-bottom:1px solid #3a3a3a;color:#d1d1d1; font-size:11px;font-weight:normal;text-shadow:none;}
#nav ul li ul li a:hover, #nav ul li ul li.active a, #nav ul li.active ul li a:hover, #nav ul li.active ul li.active a {margin:0; padding:0 0 0 10px;height:24px;line-height:24px;background:#343434;color:#fff; font-size:11px;text-shadow:none;}
#nav ul li ul ul, #nav ul li:hover ul ul, #nav ul li:hover ul ul ul, #nav ul li:hover ul ul ul ul, #nav ul li.sfHover ul ul, #nav ul li.sfHover ul ul ul, #nav ul li.sfHover ul ul ul ul {left:-999em;}

desde já agradeço a sua ajuda

Please Entrar ou Registrar to join the conversation.