Menciptakan Efek Berputar Untuk Gambar
Trisatya Blog..Hanya tinggal penambahan beberapa kode CSS di bagian SKIN dari blog dan penambahan kode pemanggil dibagian body dari blog
Tempatkan kode CSS berikut tepat diatas ]]></b:skin>
p#efekberputar img{ /* untuk efek berputar 360deg ketika dilewati cursor dan ditinggal */
-moz-transition: all 0.8s ease-in-out;
-webkit-transition: all 0.8s ease-in-out;
-o-transition: all 0.8s ease-in-out;
-ms-transition: all 0.8s ease-in-out;
transition: all 0.8s ease-in-out;
}
p#efekberputar img:hover{
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg);
transform: rotate(360deg);
}
kemudian SAVE TEMPLATE anda.
Selanjutkan dengan penempatan kode HTML pada bagian body, ini terserah anda, di sidebar juga bisa dalam postingan juga boleh.
Penempatan kode HTML
<p id="efekberputar">
<a href="http://www.joglio.blogspot.com./">
<img border="0" src="gambarnya terserah anda" /></a>
</p>
preview
Arahkah cursor pada gambar paling bawah di sidebar kananblog ini, dan lihat efek yang dihasilkan.
Untuk Jenis dan jumlah gambar terserah dari sobat blogger sekalian, yang terpenting adalah kode pemanggil CSSnya harus tepat " <p id="efekberputar"> kode HTML </p> "
ARTIKEL LAINNYA :
DESIGN========================================
SECURITY======================================
TRIK WINDOWS============================
INTERNET==================================
Cara Simple Buat Gambar Bisa Berputar
Subscribe to:
Post Comments (Atom)
DESIGN
|
SECURITY
|
TOOLS WINDOWS
|
INTERNET
|
AUDIO/VIDEO
|
OTHERS
|
0 comments:
Post a Comment