3704 Compartilhamentos 74502 Views

Menu com submenu em CSS e JavaScript

Menu expansivo vertical (com submenus) feito em CSS e JavaScript. Fácil de customizar.

INSTRUÇÕES::
Coloque na variável “n_divs” o número de categorias que irá ter o menu.
OBS: As categorias que não tiverem sub-menus, não serão contadas

Se uma categoria não tiver sub categorias, portanto não irá abrir um sub-menu.

Meu texto onde “#” é o endereço da página linkada; e target o alvo, que pode ser _self, _top, _parent ou o nome de um iframe ou frame.

Quando você quiser que uma categoria tenha sub menu, use o código:
Categoria 1

link item1A
link item2A
link item3A

Onde escondediv(‘n’,n_divs) ‘n’ é o número da categoria em ordem crescente, lembre-se
que categorias que não tem sub-menu não são contada; “id” é o nome do box que conterá o sub-menu e sempre se chamará “mdiv” seguida do número da categoria que coincidirá com ‘n’ explicado mais acima, ex: id=”mdiv1″, id=”mdiv2″ etc..

“#” é o endereço da página linkada e “target” o alvo, que pode ser _self, _top,_parent ou o nome de um iframe ou frame.

Edite as cores e estilos dos links e das células na folha de estilo logo abaixo

OBS:
As funções {onmouseover=”reveza(‘um’)” onmouseout=”volta(‘um’)”} são opcionais, elas revezam as configurações de cores e estilos dos sub-menus trocando as classes itens_menu por itens_menu_r na folha de estilo.

Para usala basta por o código dentro do link relativo ao item de sub-menu, mas é necessário atribuir uma id à td onde se encontra o link que será passado nas funções “reveza” e “volta”. O primeiro item de sub-menu está com essa opção à titulo de exemplo.

Não poderá haver dois nomes iguais para as IDs das TDs

Obs.: Código não desenvolvido por mim, mas muito interessante!

Carregando...

Você pode se interessar

Conheça Silq: a primeira linguagem criada para popularizar a programação quântica
Artigos
10 visualizações
Artigos
10 visualizações

Conheça Silq: a primeira linguagem criada para popularizar a programação quântica

Carlos L. A. da Silva - 6 de julho de 2020

Time de quatro pesquisadores do Instituto Federal de Tecnologia (ETH) de Zurique, na Suíça, quebrou paradigmas e está prestes a escancarar as portas da computação quântica.

Promoções de Jogos do Final de Semana (03/07)
Notícias
15 visualizações
Notícias
15 visualizações

Promoções de Jogos do Final de Semana (03/07)

Carlos L. A. da Silva - 3 de julho de 2020

Confira as melhores ofertas de jogos de PC para o final de semana.

Como plugar um dispositivo USB corretamente… de primeira!
Dicas
18 visualizações
Dicas
18 visualizações

Como plugar um dispositivo USB corretamente… de primeira!

Carlos L. A. da Silva - 3 de julho de 2020

Impossível? Feitiçaria? A resposta estava bem diante de nossos olhos todo esse tempo...

Deixe um Comentário

Your email address will not be published.

Mais publicações

Microsoft está mapeando o planeta inteiro para simulador de voo
Artigos
22 visualizações
22 visualizações
Promoções de Jogos do Final de Semana (26/06)
Notícias
23 visualizações
23 visualizações

Promoções de Jogos do Final de Semana (26/06)

Carlos L. A. da Silva - 26 de junho de 2020
Os 10 melhores plugins de formulário para WordPress em 2020
Artigos
24 visualizações
24 visualizações

Os 10 melhores plugins de formulário para WordPress em 2020

Carlos L. A. da Silva - 26 de junho de 2020
Você precisa conhecer Deno
Artigos
26 visualizações
26 visualizações

Você precisa conhecer Deno

Carlos L. A. da Silva - 20 de junho de 2020