Image Spring In parisHello baby!A saga continua...quer dizer o frio continua..Eu estou adorando(mentira) esta sendo bom em um lado por que eu nao estou indo para escola haha' e outro lado ruim e que e horrivel tomar banho no frio, ainda por cima se o seu chuveiro estiver quase queimando Nao to aqui para falar do meu frio ne rsrs Sei que vieram para aprender a fazer o menu que e esse fofinho aqui:Lindo ne? * Bora pro tutorial? 1.Va no seu HTML e procure por ]]></b:skin> e antes da tag cole o codigo abaixo: ul.menu01{margin:0;padding:0;list-style-type:none;display:block;font-family:"04b03", small fonts; font-size: 8px;line-height:100%;width:210px;padding-top: 2px;}ul.menu01 li{margin:0;padding:0;border-top:1px solid #bee1f0;border-bottom:1px solid #d3eef5;}ul.menu01 li a{display:block;text-decoration:none;color:#66c4e3;background:#c8e6f0;padding:0 0 0 0px;width:210px;}ul.menu01 li a:hover{background:#e7e2e4;}ul.menu01 li a.current,ul.menu01 li a.current:hover{background:#eff0f2;}/* FONTE PIXEL */@font-face {font-family: "04b03";src: url('http://static.tumblr.com/p0nqcte/56im0rvo6/04b_03__.ttf'); format("truetype"); } 2. Agora cole o codigo abaixo em um HTML/JavaScript: <ul class="menu01"> <li><a href="LINK">NOME DO LINK</a></li> <li><a href="LINK">NOME DO LINK</a></li><li><a href="LINK">NOME DO LINK</a></li> <li><a href="LINK">NOME DO LINK</a></li> </ul> Agora e so substituir como se pede. Mas caso queira modificar alguma coisa no codigo: width:210px; - para centralizar ou aumentar o fundo do menu #c8e6f0 - Cor do fundo #bee1f0 - Cor da borda no topo #d3eef5 - Cor da borda de baixo Va modificando ate ficar do jeito que quer,aconselho o uso da tabela de cores.Kisses... Oi, tudo bem? Esta muito frio aqui, fiquei tremendo o dia inteirin, eu nao aguento mais!! Minhas maos e meu pezinho esta congelando Hoje eu trouxe o efeito para equipe o Shake Hover, muito fofo *u* aqui a preview. Let's go?Primeiro voce precisa de uma imagem assim:A parte de cima que tem a foto e sem o hover [quando nao passamos o mouse encima] e a parte com meu nome e a parte com hover [quanto passamos o mouse encima]. Voce tem que cortar a imagem certo no meio, para que fique como aqui c: Agora va em Modelo > Design > Editar HTML > Ctrl + F e pesquise por ]]></b:skin> e acima cole:@-webkit-keyframes efeitomod { 50% {-webkit-transform: rotate(-4deg);} 75% {-webkit-transform: rotate(3deg); } 100% {-webkit-transform: rotate(0deg); } } .mode {background: url(LINK DA IMAGEM); height: 100px; width: 200px; display: inline-block;} .mode:hover {-webkit-animation: efeitomod .5s alternate linear; background-position: bottom;}Bem, voce apenas vai mudar as partes em Negrito, italico e sublinhado. Negrito E o link da imagem que voce fez. SublinhadoE a altura da imagem que voce fez. Mas preste atencao, voce tem que por a metade da altura total da imagen. Ex.: Sua imagem tem a altura total de 200px, voce vai so por a metade, que seria 100px. Entendeu? :3 Italico E a largura da imagem, voce tem que colocar a altura total da imagem. Entendido? isso sao as unicas coisas que voce vai mudar. Agora, para usar, coloque isso aonde voce quer que o efeito apareca:<a class='mode' href='LINK'/> Para colocar mais pessoas na equipe com este efeito, voce tem que criar uma class para cada pessoa, Ex.: Tem 3 pessoas em sua equipe, e voce quer por cada uma delas com este efeito, voce vai ter que repetir a class:.mode {background: url(LINK DA IMAGEM); height: 100px; width: 200px; display: inline-block;} .mode:hover