Blog + Search + Icon Bendera

Cara Membuat Effect Zoom Pada Gambar di Blog

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم


1. Login ke akun blogger.com
2. Pilih Template
3. Kemudian Pilih Edit HTML
4. Cari kode Tekan ( Ctrl + F )  ]]></b:skin>lalu taruh kode berikut ini diatasnya :

.ow img{

-webkit-transform:scale(0.8);
-moz-transform:scale(0.8);
-o-transform:scale(0.8);
-webkit-transition-duration: 0.5s;
-moz-transition-duration: 0.5s;
-o-transition-duration: 0.5s;
opacity: 0.7;
margin: 0 10px 5px 0;
}

.ow img:hover{
-webkit-transform:scale(1.1);
-moz-transform:scale(1.1);
-o-transform:scale(1.1);
opacity: 1;
}

5. Simpan Template jika sudah selesai.
6. Untuk menerapkan Zoom Effect ini kita harus menambahkan tag class="ow" pada kode HTML gambar.
Seperti ini contohnya :

<a class="ow" href="http://twitter.com/kurniasepta" ><img border="0" height="177" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-bd9GMMHgXwNPoH3g1tFHUmW-kuNtnlj1G712UmEMzRfLcI2e412PJrTslyOB9f4fUMzYOagHeck3QKiLB-6jZPoO16Zzq1yhMX2x38rd4-KviMmOd3QzXyYx3r1s6LxjwPIa14Ww28E/s320/follow.jpg" width="284" /></a>









Disini
Share On Facebook




Terjemahkan Halaman Ini







Comments
0 Comments

Tidak ada komentar:

KETERANGAN GAMBAR