Oyahou, minna-san, agora trago um efeito para imagens, criado por mim, como normalmente. No entanto, não tem nada assim de especial, pois consiste em juntar partes de vários efeitos ~dái o nome mixture. Só posto aqui para o caso voltar a precisar, eu achei que ficou fofo, pouco chamativo, e é provável que use em vários layouts. Neste momento até está na imagem de welcome do blog, mas vejam a preview em baixo ;)
Preview
nota1» entre as duas imagens, à rotação;nota2» o fundo não vem incluído;- Podem ver melhor aqui (www).
sem hover |
com hover |
Fazendo:
Vá ao seu HTML e antes de /b:skin, escreva:
.efeitomix {
border: 1px dotted #D2691E;
padding: 1px;
border-radius: 5px;
opacity:0.82;
-webkit-transition-duration: .50s;
}
.efeitomix:hover {
border: 1px solid #CD0000;
border-radius: 0px;
box-shadow: 1px 0px 4px #FF4500;
opacity:1.0;
-webkit-transform: rotate(360deg);
-webkit-transition-duration: .50s;
}
Você já sabe como aplicar efeitos, não? Na classe da imagem, dentro do gadget. De qualquer modo, aplique assim:
<img src="URLDAIMAGEM" class="efeitomix" />
Sem comentários:
Enviar um comentário