04 julho 2013

Menu Up & Down

| |
Status: Gayband do The Wanted brincando com meus sentimentos, até quando? #WeOwnTheNight
Sem ideias pra introdução nesses dias, aí sai essas coisas...
Oi gente!
Estou numa séria fase de abstinência de Revenge e The Vampire Diaries, não aguento mais viver sem! Estou com saudades de como o Stefan se ferrava no fim dos episódios e, em Revenge, até do idiota do Jack, que já tava irritando... Agora só tenho Teen Wolf ¬.¬

Mudando de assunto, esses dias eu estava teimando em fazer um menu (apresentável) pra vocês já que na minha tags menu não tem nem 10 posts e nos efeitos tem milhares. Eu gostei do resultado (O.O milagre de Deus!) Aqui uma preview: ••••

••• ♥ •••
Use com tooltip, é mais legal! ^-^

1 • No HTML do seu blog, aperte F3 e procura pela tag ]]></b:skin> • Quando achar, cole o seguinte código acima:
.fade-isa {
font-family: trebuchet ms;
font-size: 11px;
padding: 5px;
background-color: #COR DO FUNDO (ROSA);
box-shadow: inset 0 0 20px #COR DA SOMBRA INTERNA (ROSA), 0 0 4px #ccc;
text-align: center;
width: TAMANHO DO MENUpx;
text-transform: uppercase;
word-spacing: 5px;
letter-spacing: 1px;
-webkit-transition-duration: .80s;}
.fade-isa a {
color: #COR DA FONTE;
text-align: center;
padding-top: 20px;
padding-bottom: 20px;
padding-left: 5px;
padding-right: 6px;
text-shadow: 2px 1px 1px #COR DA SOMBRA DO TEXTO;
-webkit-transition-duration: .80s;}
.fade-isa a:hover {
color: #COR DA FONTE AO PASSAR O MOUSE;
text-shadow: 2px 1px 1px #COR DA SOMBRA AO PASSAR MOUSE;
text-align: center;
padding-top: 5px;
padding-bottom:5px;
padding-left: 5px;
padding-right: 6px;
background-color: #COR DO QUADRADINHO (AZUL);
box-shadow: inset 0 0 20px #COR DA SOMBRA DO QUADRADINHO (AZUL), 0 0 4px #ccc;
-webkit-transition-duration: .80s;}
É grande, eu sei mas tudo o que é preciso é prestar atenção no que se pede e substituir o que está em MAIÚSCULO.

Aí é só visualizar - para ver se nada desconfigurou - e depois salvar.

•••••••••• ♥ ••••••••••

2 • Vá em Layout ♣ Adicionar Gadgets ♣ HTML/JavaScript e cole:
<div class="fade-isa">
<a href="LINK" title="Alguma coisa aqui">Nome</a>
<a href="LINK" title="Alguma coisa aqui">Nome</a>
<a href="LINK" title="Alguma coisa aqui">Nome</a>
<a href="LINK" title="Alguma coisa aqui">Nome</a>
<a href="LINK" title="Alguma coisa aqui">Nome</a>
<a href="LINK" title="Alguma coisa aqui">Nome</a>
<a href="LINK" title="Alguma coisa aqui">Nome</a></div>
Em Alguma Coisa Aqui escreva o que você quer que apareça no tooltip (uma mensagem que aparece em um balãozinho, como podem ver ao passar o mouse nas imagens dos afiliados) Caso não queira o tooltip, apague: title="Alguma coisa aqui"

•••••••••• ♥ ••••••••••
Espero que tenham gostado do menu porque eu fiz com um cuidado especial pra postar para vocês. Por favor, não repassem e se usar creditem, ok?

Beijos ;)

14 comentários:

  1. Awn, adorei o menu super lindo :3
    um abraço ~

    ResponderExcluir
  2. ADOREI, Super lindo esse menuzinho.http://apenas1em2.blogspot.pt/

    ResponderExcluir
  3. Que menu lindo, eu amei ele !! Vou usar quando eu precisar com certeza ;)

    xoxo♥

    Crazy Girl ~

    ResponderExcluir
  4. Lindo menu, já vi um efeito parecido espalhado pelos blogs, mas não esse.
    Lindo seu blog! Beijos

    http://semprefuiestranha.blogspot.com.br/

    ResponderExcluir
  5. Eu amo TVD e Revenge coitado do Stefan haha O menu é muito lindo
    http://eternityclouds.blogspot.com.br/

    ResponderExcluir
  6. Que menu mais lindoo *-----* A sério, adoreii mesmo se calhar vou usar >3<
    Kiss ~

    letterofpain.blogspot.com

    ResponderExcluir
  7. Amei o post! estou usando o menu no meu blog! muito obrigado!
    da uma passadinha lá no meu blog!
    http://www.guhstavosecrets.blogspot.com

    ResponderExcluir
  8. eu amei o seu menu era exatamente o que procurava, estou usando em meu blog, mas é claro que creditei...beijos
    http://zombiecutie.blogspot.com.br/

    ResponderExcluir
  9. No width você aconselha colocar quanto, moça?

    ResponderExcluir
  10. tentei colocar o menu, mas ele só fica na vertical... como corrijo?

    ResponderExcluir

« »