0 Cara membuat efek Profile berputar saat di sentuh mouse

Selamat malam semuanya,kali ini saya akan berbagi ilmu tentang cara membuat gambar profil blog berputar pada saat di sentuh cursor,sebenarnya postingan ini sudah lama aku simpan tetapi belum saya publikasikan,oke kita langsung saja ke langkah langkah pembuatan nya.pertama tama

1.buka akun bloganda

2.masuk edit HTML jangan lupa centang tombol kota yang ada di samping kanan atas.

3.Cari kode ]]></b:skin> 

4.kalau sudah ketemu kode ]]></b:skin>  letakkan kode dibawah ini tepat di atas kode ]]></b:skin>

.profile-img{

border:2px dashed #ffffff;

opacity:0.8;

border-radius:6px;

margin:0px 0 0px 0px;

padding:4px;

box-shadow:1px 1px 1px #555,-1px -1px 1px #555,0 0 8px #ffffff;

-moz-box-shadow:1px 1px 1px #555,-1px -1px 1px #555,0 0 8px #ffffff;

 -webkit-box-shadow:1px 1px 1px #555,-1px -1px 1px #555,0 0 10px #ffffff;

 -o-transition:margin-left 1.5s ease-in 2s,margin-top 1.5s 2.5s,-o-transform 1.5s ease-out 1s,opacity 2s ease-in; -moz-transition:margin 1.5s ease-in 2s,-moz-transform 1.5s ease-out 1s,opacity 2s ease-in; -webkit-transition:margin 1.5s ease-in 2s,-webkit-transform 1.5s ease-out 1s,opacity 2s ease-in

}

.profile-img:hover{

opacity:1.0;

border-radius:8px;

-moz-border-radius:8px;

 -webkit-border-radius:8px;

-o-border-radius:8px;

-moz-box-shadow:1px 1px 1px #F00,-1px -1px 1px #F00,0 0 16px #F00;

-webkit-box-shadow:1px 1px 1px #F00,-1px -1px 1px #F00,0 0 16px #F00;

-o-box-shadow:1px 1px 1px #F00,-1px -1px 1px #F00,0 0 16px #F00;

margin:40px 0px 20px 10px;

 -o-transform:rotate(1460deg) scale(1.8) translate(35px,10px);

 -moz-transform:rotate(1460deg) scale(1.8) translate(35px,10px);

 -webkit-transform:rotate(1460deg) scale(1.8) translate(35px,10px);

 -o-transition:margin-left 1.5s ease-in 0.4s,margin-top 1.5s,-o-transform 2.5s ease-out 1.4s,opacity 3s ease-in 4s;

 -moz-transition:margin 1.5s ease-in 0.4s,-moz-transform 2.5s ease-out 1.4s,opacity 3s ease-in 4s; -webkit-transition:margin 1.5s ease-in 0.4s,-webkit-transform 2.5s ease-out 1.4s,opacity 3s ease-in 4s

}

Penjelasan:

kode yang saya kasih warna itu bisa anda ganti menurut selera anda,dari border sampai ke efek warna nya bisa kalian ganti sendiri..Sekian dan trimakasih semoga postingan saya ini berguna buat pengguna blogger semua.

 

Sumber: http://kediri-blognet.blogspot.com/