4.8.13

Menu Teen Bye



Hello Lady's Sexy's

As aulas começaram! Sejam bem vindos novamente em seus colégios e escolas! Pois é, as aulas começaram, mas não se preocupem, sempre estarei atualizando o blog trazendo novidades pra vocês, e admito, estou com muita saudade de postar coisas relacionadas ao PhotoScape, meu filinho-sqn, mas enfim,  blog new, new life!  Agora vamos falar do menuzinho >3<

Cá estou eu aqui novamente trazendo um menu muito legal para brincar, ele é tipo assim: Super,hiper,mega fofo. Sinceramente, foi o menu que eu já fiz que eu mais gostei, ele é quase parecido com o que tá no gadget welcome, ali na divulgação. Porém o meu aumenta e esse gira pará trás até sumir completamente. Veja a PREVIEW AQUI, se gostar prossiga <3 eu gostei hehe ~~> 


1. Para aplicar no blog vá em modelo > Editar HTML > Dê um lindo F3  e procure por ]]></b:skin> acima disso cole:

/*---MENU TEEN BYE, CRIADO PELO BLOG SWEEET FLOWER (sweeet-flower.blogspot.com)---*/
#teenbye {
@font-face {font-family: "Simple Kind Of Girl"; src: url('http://static.tumblr.com/lq2ha19/li7mqri97/simple_kind_of_girl.ttf');}background: #ffc3d1; /*Cor de fundo do menu*/
line-height: 20px; /*altura da linha, não mecha a menos que mude de fonte*/
width: 100px; /*Largura do menu, aumente ou diminua se precisar*/
font: 19px simple kind of girl; /*Tamanho e tipo de fonte(nome)*/
display: inline-block; /*Não mecha ;D*/
padding: 1px; /*Espaçamento interno*/
margin: 3px; /*Espaço entre 'um menu e outro'.*/
box-shadow: inset 0 0 8px #fcd1db, 0px 0px 11px #fe9db4; /*Sombra dentro e fora: tamanho, e cor.*/
-moz-box-shadow: inset 0 0 8px #fcd1db, 0px 0px 11px #fe9db4; /*Sombra dentro e fora: tamanho, e cor. Repita a de cima*/
-ms-inset 0 0 8px #fcd1db, 0px 0px 11px #fe9db4; /*Sombra dentro e fora: tamanho, e cor. Repita a de cima*/
-o-inset 0 0 8px #fcd1db, 0px 0px 11px #fe9db4; /*Sombra dentro e fora: tamanho, e cor. Repita a de cima*/
-khtml-inset 0 0 8px #fcd1db, 0px 0px 11px #fe9db4; /*Sombra dentro e fora: tamanho, e cor. Repita a de cima*/
-webkit-transition-duration: 4.5s; /*Não mecha ;D ou o efeito não ficara bom.*/
-moz-transition-duration: 4.5s; /*Não mecha ;D ou o efeito não ficara bom.*/
-ms-transition-duration: 4.5s; /*Não mecha ;D ou o efeito não ficara bom.*/
-o-transition-duration: 4.5s; /*Não mecha ;D ou o efeito não ficara bom.*/
-z-transition-duration: 4.5s; /*Não mecha ;D ou o efeito não ficara bom.*/
-khtml-transition-duration: 4.5s; /*Não mecha ;D ou o efeito não ficara bom.*/
border-radius: 4px; /*Bordas levementes arredondadas*/
-moz-border-radius: 4px; /*Bordas levementes arredondadas, repita a de cima*/
-ms-border-radius: 4px; /*Bordas levementes arredondadas, repita a de cima*/
-o-border-radius: 4px; /*Bordas levementes arredondadas, repita a de cima*/
-z-border-radius: 4px; /*Bordas levementes arredondadas, repita a de cima*/
-khtml-border-radius: 4px; /*Bordas levementes arredondadas, repita a de cima*/
}
#teenbye:hover {
color: #fff;
-webkit-transition-duration: 1.4s;/*Não mecha ;D*/
-moz-transition-duration: 1.4s;/*Não mecha ;D*/
-ms-transition-duration: 1.4s;/*Não mecha ;D*/
-o-transition-duration: 1.4s;/*Não mecha ;D*/
-z-transition-duration: 1.4s;/*Não mecha ;D*/
-khtml-transition-duration: 1.4s;/*Não mecha ;D*/
-webkit-transform: scale(0.0) rotate(360deg);/*Não mecha ;D*/
-moz-transform: scale(0.0) rotate(360deg);/*Não mecha ;D*/
-ms-transform: scale(0.0) rotate(360deg);/*Não mecha ;D*/
-o-transform: scale(0.0) rotate(360deg);/*Não mecha ;D*/
-z-transform: scale(0.0) rotate(360deg);/*Não mecha ;D*/
-khtml-transform: scale(0.0) rotate(360deg);/*Não mecha ;D*/
}
#teenbye a{ /*---LINKS SEM HOVER---*/
text-decoration: none;
color: #fff;  /*Cor do link*/
text-shadow: 0px 0px 10px #aaa; /*sombra no texto, altere o tamanho e a cor de quiser*/
-webkit-transition-duration: 1.1s;
-moz-transition-duration: 1.1s; /*Não mecha ;D*/
-o-transition-duration: 1.1s; /*Não mecha ;D*/
-khtml-transition-duration: 1.1s; /*Não mecha ;D*/
-z-transition-duration: 1.1s; /*Não mecha ;D*/
-ms-transition-duration: 1.1s; /*Não mecha ;D*/
transition: 1.1s; /*Não mecha ;D*/
}
#teenbye a:hover{ /*---LINKS HOVER---*/
color: #aaa; /*Cor do link ao passar o mouse*/
-webkit-transition-duration: 1.1s; /*Não mecha ;D*/
-moz-transition-duration: 1.1s; /*Não mecha ;D*/
-o-transition-duration: 1.1s; /*Não mecha ;D*/
-khtml-transition-duration: 1.1s; /*Não mecha ;D*/
-z-transition-duration: 1.1s; /*Não mecha ;D*/
-ms-transition-duration: 1.1s; /*Não mecha ;D*/
transition: 1.1s; /*Não mecha ;D*/
}
/*fim :D*/

2. Vá em Layout > Adicionar Gadget > HTML/JavaScript e cole o seguinte código nele:

 <center>
<div id="teenbye"><a href="LINK">NOME</a></div>
<div id="teenbye"><a href="LINK">NOME</a></div>
<div id="teenbye"><a href="LINK">NOME</a></div>
<div id="teenbye"><a href="LINK">NOME</a></div>
<div id="teenbye"><a href="LINK">NOME</a></div>
<div id="teenbye"><a href="LINK">NOME</a></div>
<div id="teenbye"><a href="LINK">NOME</a></div>

E prontinho, o menu já esta instalado em seu meu blog ^^ e não se esqueça de fechar com a tag </center> pra ficar tudo centralizado <3 sei que meus códigos são bem grandinhos kkkk mas é porque eu repito eles várias vezes com outros comandos para funfarem em outros navegadores, este mesmo, funfa em quase todos hihihi. Beijos de luz :3

8 comentários:

  1. Amei o menu, muito lindo.
    Beijocas, Lili ;3
    Clique aqui, e vá para o blog / Princesa Teen.
    Clique e veja meus videos. / E se inscreve ok?!

    ResponderExcluir
    Respostas
    1. Obrigada, hehe achei esse um dos mais lindos que já fiz

      Excluir
  2. Adorei o menu,muito fofo e o efeito é super legal :3
    beijos,boa semana!
    quemprecisadetvparaverbeyonce.blogspot.com.br

    ResponderExcluir
    Respostas
    1. Obrigada, pior que é mesmo kk.
      Beijos e boa semana pra você também!

      Excluir
  3. HAHA Amei o menu :3 gostei dele vou usar no próximo lay *0*

    http://forever-teens-89.blogspot.com.br/

    ResponderExcluir

Hey, que bom que irá comentar! Mas, leia as regras;

- Comente sobre o post >3<
- Deixe o link do seu blog no final, retribuirei
- Respondo todos os comentários
- Retribuo todos os comentários
- Não comente besteira, nem seja racista :3
- Criticas construtivas são bem vindas :D
- Sigo de Volta todos que me seguirem primeiro.