Olá!

Hoje vou mostrar uma série de tutoriais que encontrei pela internet sobre como desenvolver menus animados e estilizados utilizando CSS e JQuery. Vale a pena dar uma conferida!

Tutoriais, demos e códigos de 10 menus JQuery

Menu dropdown animado
Um tutorial completo sobre como criar um menu animado usando JQuery e CSS sem usar plugin.  Ensina tudo mesmo, desde o início. E o resultado é um bonito menu dropdown estilizado.
Tutorial – Demo

Menu dropdown estilo iPod com suporte a ThemeRoller
Esse é muito bacana, principalmente devido a facilidade de estilização usando o ThemeRoller.
Você escolhe o tema e vê o resultado na hora. Possui bonito efeitos e possibilidades de submenus.
Tutorial – Demo

Superfish menu
É um plugin JQuery, de fácil utilização com muitas opções, inclusive funções de callback.
Tutorial – Demo

Lavalamp menu
Muito bacana esse menu: você passa o mouse sobre o itens e uma animação é exibida para destacar o item que o mouse está por cima. Possui diversos exemplos.
Tutorial & Demo

Menu animado com efeitos animados estilizado com imagens
Tutorial – Demo

JQuery menu inspirado no Mootools
Muito simples de se implementar e bonito de se ver.
Tutorial – Demo

Sliding-sliding doors Menu
É outro que vale a pena dar uma olhada. Muito bacana!
Tutorial - Demo 1 – Demo 2

Vertical sliding menu
Uma imagem que quando clicada abre um menu. É um tipo de menu utilizado em grandes portais.
Tutorial - Demo

Menu estilo Apple
Este tutorial ensina até a criar as imagens no Photoshop. Muito completo o tutorial, e você baixa até os arquivos psd! E o resultado final é magnífico! Veja a demo!
Tutorial – Demo

Animação de imagens e cores de background usando JQuery
O resultado é muito legal, e o tutorial está bem didático. Ensina a animar imagens de background, e a mudar a cor do menu com efeito de fade.
Tutorial - Demo

A vantagem de se usar menus (x)html usando JQuery e CSS é que você pode monitorar os links do menu de navegação usando, por exemplo, o Google Analytics, e sem abrir mão dos efeitos visuais, que parecem que foram feitos em flash.

Eu descobri esses exemplos no site http://www.catswhocode.com/blog/10-incredible-jquery-navigation-menus

Deixe um comentário!

Posts Relacionados:

• Background css animado