22 de fev de 2013

Menu Splasher


Oi diamantes :) Desculpem não estar postando muito. Só vou poder postar normalmente a partir de 7 de Março, altura em que acabam minhas provas.

Trouxe um menu que adaptei de um tumblr (deste, acho eu), em que o icon gira e o link sobe, se quiserem visualizar, cliquem.

Para aplicá-lo, vá ao html, pesquise por ]]></b:skin> e por cima cole :


/***Menu Simone(cerejadosundae)**/
 .navsm{float:center; overflow: hidden;background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#fff));display: inline-block; padding: 2px; text-align: center; color:#aaa;margin:1px; line-height:40px;height:40px;width:40px;font-size: 10px;font-family: 'trebuchet ms', sans-serif; -webkit-transition: all 0.5s linear;-moz-transition: all 0.5s linear;transition: all 0.5s linear;border-radius:100px; border: 1px solid #d6d6d6;}
.navsm:hover {height:56px;background: #FFFFFF;color:#aaa;}
.navsm img{width:18px;margin-top:10px; -webkit-transition: all .5s ease-out; -moz-transition: all .5s ease-out; }
.navsm:hover img{-webkit-transform: rotate(360deg); }

Adicione um gadget html/javascript e cole quantas vezes precisar :

<a href="LINK"><div class="navsm"><img src="ICON" />
NOME</div></a>

Deixo aqui alguns icons (se soubesse fazer, fazia mais).



Beijos :)






16 comentários:

  1. Esse menu é super diferente! Achei muito lindo esse efeito de gira-gira que tem nos icons.
    Ótimo tutorial! Beijos
    efeitosdaadolescencia.blogspot.com

    ResponderExcluir
  2. Que lindo o menu! Mas eu não gosto muito destes tipos, eu prefiro os mais básicos.

    Seguindo! Retribui? www.oh-star.org (♥)

    ResponderExcluir
  3. O menu fica perfeito e é super pratico.
    Beijos
    Inside Of Me (perfil)

    ResponderExcluir
  4. que menu lindo,é legal na sidebar,e tudo bem por n ter postado,acho que todos temos provas escolares que tornam a vida na blogosfera mais dificil

    ResponderExcluir
  5. Ótimoo tutorial!
    Ótimo Post!
    By: Nath
    MundoFantasticoFeminino.blogspot.com.br/
    Participe do Sorteio!

    ResponderExcluir
  6. achei bem legal!

    Obrigada pela visita no blog, volte sempre!
    @esteffanifontes, do blog Aos Dezesseis Anos
    aosdezesseisanos.blogspot.com.br

    ResponderExcluir
  7. Muito legal esse menu! Adorei :)

    Novo layout no BDF! Corra para ver:
    Batom De Framboesa.

    ResponderExcluir
  8. Adorei o tutorial, espero que suas provas acabem logo pra você voltar a postar normalmente :3
    PiinkCookie.blogspot.com ♥ Participe do sorteio

    ResponderExcluir
  9. Adorei o menu, fica bem legal :D
    Ótimo tuto ^.^
    Beijinhos
    Twtter do blog
    Facebook do blog
    conversando-com-a-lua.blogspot.com.br

    ResponderExcluir
  10. Adorei o tutorial, e nunca tinha visto esse menu, rs.

    Xx
    www.likeparadise.com.br

    ResponderExcluir
  11. òtimo tutorial! >.<
    Zombie World

    ResponderExcluir
  12. Que legal isso, bem útil o post! E boa sorte com os estudos.
    www.espacegirl.com

    ResponderExcluir
  13. Muito bom esse tuto, ajudo bastante gente ><
    Beijos ti espero lá .
    Vinte Desejos - Blog  |  Facebook

    ResponderExcluir
  14. oi oi oi oi oi dnv! Cmo colocar gadget seguidores pequenino como o seu?

    @esteffanifontes, do blog Aos Dezesseis Anos
    aosdezesseisanos.blogspot.com.br

    ResponderExcluir
  15. Muito lindo o blog de vocês , sempre estou visitando pois adoro todos os tutoriais . SEGUINDO <3

    segue de volta ? http://planetagarotas2.blogspot.com.br/

    Mil beijoos s2

    ResponderExcluir

Obrigada por ler e comentar!
Deixe o link do seu blog (ou seu perfil aberto) para que eu possa retribuir. Não gosto muito de responder dúvidas via comentários, então prefiro que você mande na ask ali ao lado ->
Comentários de divulgação sem nada sobre o post não serão retribuidos. Fale pelo menos um pouquinho sobre o post, por favor.
Faça aos outros aquilo que você quer que façam para você.