Tag Archives: barra de menu

Barra de menu retrátil com CSS3

barra de menu retrátil com css  - dicas de cssNesse tutorial irei ensinar como criar uma barra de menu retrátil em CSS3 que ficará oculto no rodapé da página com apenas uma pequena faixa a mostra com uma pequena seta apontando para cima para que o usuário possa perceber que se trata de um elemento oculto.

Usando propriedades css3 a barra de menu terá um nível de transparência ou ser totalmente sólida bastando mudar as configurações no código css.

Os ícones do menu também serão semitransparentes e ao passar o mouse em cima, eles se tornarão opacos com efeito fade in.

Continue lendo »

Barra de menu CSS3 com background deslizante

Barra de menu CSS 3 com background deslizante  - dicas de cssEfeitos impensáveis de serem conseguidos apenas com CSS tornam-se possíveis com a versão 3 dessa linguagem de folha de estilos.

Hoje podemos até criar animações usando apenas propriedades do CSS3, e é isso que iremos fazer hoje.

Criaremos uma barra de menu em CSS3 que terá um background com gradiente e links levemente sombreados para dar um efeito mais profissional no nosso menu.

Teremos um segundo background que ficará um nível acima do primeiro, ficando entre o background principal e os links e será deslocado em efeito deslizante para baixo de cada link quando o mouse passar por cima de cada um deles.

Continue lendo »

Barra de menu com simulação de botões independentes

barra de menu css com simulação de botões independentes  - dicas de cssAs vezes com soluções bem simples conseguimos resolver problemas de maneira bem eficiente, e é sempre assim que deve ser feito quando for possível.

Hoje vamos criar uma barra de menu css inteiriça mas que no entanto irá simular botões independentes  com layout líquido, e isto será feito usando apenas uma lista HTML.

Com  o uso de apenas duas pequenas imagens, que estão disponíveis para download aqui: Imagens para a barra de menu css com simulação de botões independentes conseguiremos esse efeito deixando o nosso menu bastante leve e funcional.

Continue lendo »

Barra de menu com CSS

barra de menu  - dicas de cssNesse tutorial você vai aprender a criar uma barra de menu em css que ficará fixa no topo do site ou no rodapé e a posição poderá ser mudada em tempo real pelo usuário.

Usaremos alguns ícones e pequenas imagens para criar esse menu em css que também terá uma pequena função javascript para possibilitar a mudança de posição do menu em tempo real, do topo para o rodapé e vice versa.

A barra de menu terá também um segundo menu com apenas links em texto.

Usaremos a propriedade css position com valor fixed para colocarmos o menu fixo e flutuante, porém como sempre, o IE não respeita o valor fixed então usaremos também um Meta Tag para corrigir o problema.

Continue lendo »