14 de set. de 2014

Menu Fofo Giratório

   
Oie gente boa tarde, como está domingo?? almoçaram muito? eu sim, rsrsrs, gente obrigada pela participação de todos vocês no blog, que bom que estão gostado das postagens e tudo mais, lembre-se se quiserem pedir um tutorial é só visitar a minha ask que eu vou responder você! A ontem eu assisti a um filme novo do Adam Sandler,o nome do filme é "Tudo junto e misturado" vocês já ouviram falar?? Bom o filme é ótimo e também conta com a participação da linda e maravilhosa Drew Barrymore, o filme é muito divertido, eu ri bastante assistindo com minhas amigas, super descontraído e com um romancezinho muito legal dos protagonistas, eu super recomendo ele para vocês! O tutorial de hoje traz para vocês um lindo menu que quando você passa o mouse sobre ele, ela começa a girar, eu adorei e achei muito fofo, por isso resolvi compartilhar com vocês, vamos ver?



01-Passo; Coloque o código abaixo em um HTML/JAVASCRIPT

<style>
a.circ, a.circ2, a.circ3, a.circ4, a.circ5{
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
margin:8px;display:block;
text-align:center;
color:#eee;font-family:arial;
text-transform:uppercase;font-size:1px;
width:30px;height:30px;
border:5px solid #FFD685;padding:2px;
border-radius:1000px;}
a.circ:hover, a.circ2:hover, a.circ3:hover, a.circ4:hover, a.circ5:hover{
color: #000000;font-size:5px;
-webkit-transform: scale( -2.0) rotate( 540deg);
-moz-transform: scale( -2.0) rotate( 540deg);}
a.circ{background-image:url(http://i1221.photobucket.com/albums/dd461/kawaii_annyz/Sintiacutetulo-1.png);border:5px solid #FFE0EC;}
a.circ2{background-image:url(http://i1221.photobucket.com/albums/dd461/kawaii_annyz/Sintiacutetulo-1.png);border:5px solid #E2DEF9;}
a.circ3{background-image:url(http://i1221.photobucket.com/albums/dd461/kawaii_annyz/Sintiacutetulo-1.png);border:5px solid #FAF9C8;}
a.circ4{background-image:url(http://i1221.photobucket.com/albums/dd461/kawaii_annyz/Sintiacutetulo-1.png);border:5px solid #D9F2FF;}
a.circ5{background-image:url(http://i1221.photobucket.com/albums/dd461/kawaii_annyz/Sintiacutetulo-1.png);border:5px solid #DEEAD1;}
a.circ:hover{background: #FFF4FC;}
a.circ2:hover{background: #F1EEFF;}
a.circ3:hover{background: #FFFEE4;}
a.circ4:hover{background: #E8F8FF;}
a.circ5:hover{background: #EEF5E8;}
</style><br />
<div style="left: 40px; position: fixed; top: 150px;">
<a class="circ" href="http://www.blogger.com/LINK"><br /><br />Tutorial</a>
<a class="circ2" href="http://www.blogger.com/LINK"><br /><br />Recursos</a>
<a class="circ3" href="http://www.blogger.com/LINK"><br /><br />Afiliados</a>
<a class="circ4" href="http://www.blogger.com/LINK"><br /><br />aqui sua categoria</a>
<a class="circ5" href="http://www.blogger.com/LINK"><br /><br />aqui sua categoria</a></div>

Altere as partes desejadas, como as imagens, as cores e etc. Salve e aproveite o resultado!

11 comentários:

  1. Muito muito fofo! Adorei, sempre tutoriais lindos!
    O filme parece ser giro, já apontei e vou ler!
    Bjs,

    un--cover.blogspot.com

    ResponderExcluir
  2. Que menu mais fofo!Talvez eu use em um Lay....
    Aceita afiliação?

    -http://animegirlskawaii.blogspot.com.br/

    ResponderExcluir
    Respostas
    1. Obrigada, aceito sim, já vou te colocar aqui.. beijos!

      Excluir
  3. Amei o tutorial, estava precisando saber como funcionava! Necessito ver o filme do Adam <3

    http://deiumjeito.blogspot.com.br/

    ResponderExcluir
  4. que menu fofo! um dia desses eu uso :3
    bjs, y-oungsoul

    ResponderExcluir
  5. Bom estou gripada então diria que meu domingo não foi lá essa coisas hu3 e nem almoçei, mas comi bolacha hahahha' *u* esse filmes parece legal, vou ver eles depois ( apesar de não ver muitos filmes heuehe ) Esse menuzinho É MUITO FOFO ♥ que kawaii >;<

    bjs

    || i-nfinitestars.blogspot.com ||

    ResponderExcluir
    Respostas
    1. rsrs é horrível quando estamos doente, o filme é ótimo e que bom que gostou do menu!

      Excluir
  6. aahhh muito obrigado, eu estava justamente fazendo um lay do rilakkuma

    ResponderExcluir