Efeito Cute Stress

 Mel diz: Oi Galera -q- Como vocês estão? Cadê os comentários de vocês? Vocês me abandonaram mesmo? Tá né... Bom, desculpem eu está sumindo, mas eu tava de castigo e estou na época de provinhas as vezes, abarrotada de trabalhos, e creio que vocês também estejam, pois a blogosfera tá meio parada! Além disso, sou péssima em divulgação e afins, estava pensando em fazer um game, mas alguém iria participar? Porque um game sem ninguém participando não dá né galera? -agora completa isso-

 Na postagem de hoje trago o efeito "Cute Stress" que é meio que um fofo estressado, eu não tenho muita criatividade, mas dei este nome porque ele tem opacidade antes de passar o mouse e quando passa o mouse ele fica preto e branco e remexendo, enfim, desculpem a péssima definição



 É muito simples, crie um gadget de HTML/JAVA SCRIPT e cole este código aqui:

<a href="URL DO LINK" target="_blank" style="font-style: normal;"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjCjmc6Twg6cLC0oNFtPHsdTvVL7q-QkvIqZgORi_RgMgb6DxUwR3SY7crxVfZSsLMSa50xVwSw1GXYj0InL-FM1w2qTLVaPfwmTKOyMlWtuQYOcmfvV-SmIJY2juYdBnwc_SHQmuol_s/s1600/262.png" border="0" class="stress" title="NOME DO LINK" /></a>

 Bom, você vai notar que não vai acontecer nada, para o efeito ser aplicado, vá em modelo>editar html>expanda a primeira setinha>procure por /b:skin e cole acima deste código isto aqui:

@-webkit-keyframes stress {
1% {-webkit-transform: skew(5deg); }
25% {-webkit-transform: skew(-5deg);  }
50% {-webkit-transform: skew(5deg); }
75% {-webkit-transform: skew(-5deg);  }
100% {-webkit-filter: grayscale(100%);  }
}
.stress {opacity:0.8; -webkit-transition: .7s; border-radius: 100px; }
.stress:hover {-webkit-animation: stress .7s alternate infinite linear;} 

  Prontinho!! O resultado será semelhante a isto: