logo blog
Selamat Datang Di Blog C78
Terima kasih atas kunjungan Anda di blog C78,
semoga apa yang saya share di sini bisa bermanfaat dan memberikan motivasi pada kita semua
untuk terus berkarya dan berbuat sesuatu yang bisa berguna untuk orang banyak.

Efek-efekan Animasi gambar Dengan Css


Kumpulan Efek-efekan Animasi gambar Dengan Css.
Cara memasangnya silahkan tanya mbah Google saja.Kalau ga salah nyimpannya di atas
]]></b:skin>.

efek lupa ah Coba saja sendiri
.post img{
-webkit-transition:all .5s ease-out;
-moz-transition:all .5s ease-out;
-ms-transition:all .5s ease-out;
-o-transition:all .5s ease-out;
transition:all .5s ease-out;
}

.post img:hover{
-webkit-transform:translate(0px,10px);
-moz-transform:translate(0px,-10px);
-ms-transform:translate(0px,-10px);
-o-transform:translate(0px,10px);
transform:translate(0px,-10px);
}

Efek Fade out
.post img{
-webkit-transition:opacity .5s ease-out;
-moz-transition:opacity .5s ease-out;
-ms-transition:opacity .5s ease-out;
-o-transition:opacity .5s ease-out;
transition:opacity .5s ease-out;
}

.post img:hover{
opacity:0.2;
}


Efek Fade In 
.post img{
-webkit-transition:opacity .5s ease-out;
-moz-transition:opacity .5s ease-out;
-ms-transition:opacity .5s ease-out;
-o-transition:opacity .5s ease-out;
transition:opacity .5s ease-out;
opacity:0.2;
}

.post img:hover{
opacity:1;
}

efek berputar
.post img{
-webkit-transition:all 0.5s ease-out;
-moz-transition:all 0.5s ease-out;
-ms-transition:all 0.5s ease-out;
-o-transition:all 0.5s ease-out;
transition:all 0.5s ease-out;
}

.post img:hover{
-webkit-transform:rotate(360deg);
-moz-transform:rotate(360deg);
-ms-transform:rotate(360deg);
-o-transform:rotate(360deg);
transform:rotate(360deg);
}

efek membesar
.post img{
-webkit-transition:all 0.5s ease-out;
-moz-transition:all 0.5s ease-out;
-ms-transition:all 0.5s ease-out;
-o-transition:all 0.5s ease-out;
transition:all 0.5s ease-out;
}

.post img:hover{
-webkit-transform:scale(2,2);
-moz-transform:scale(2,2);
-ms-transform:scale(2,2);
-o-transform:scale(2,2);
transform:scale(2,2);
}


Efek miring
.post img{
-webkit-transition:all .5s ease-out;
-moz-transition:all .5s ease-out;
-ms-transition:all .5s ease-out;
-o-transition:all .5s ease-out;
transition:all .5s ease-out;
}

.post img:hover{
-webkit-transform:skew(30deg,20deg);
-moz-transform:skew(30deg,20deg);
-ms-transform:skew(30deg,20deg);
-o-transform:skew(30deg,20deg);
transform:skew(30deg,20deg);
}

Kalau sudah di pasang silahkan anda save dan lihat hasilnya.Semoga bemanfaat
Enter your email address to get update from Kompi Ajaib.
Print PDF
Next
« Prev Post
Previous
Next Post »

Copyright © 2013. C78 Blog sharing - All Rights Reserved | Template Created by Kompi Ajaib Proudly powered by Blogger