Link-Link Blog

Selasa, 13 November 2012

Cara Simple Buat Gambar Bisa Berputar

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> "   





Berpenghasilan Dari Sekedar Ngeblog




ARTIKEL LAINNYA :


DESIGN========================================




































SECURITY======================================


























TRIK WINDOWS============================




  


































INTERNET==================================



  







Posted by at
Labels:

Tidak ada komentar:

Posting Komentar

Langganan: Posting Komentar (Atom)