Cara Membuat Simple Zoom Photo

Untuk membuat simple zoom in seperti contoh gambar di atas (letakkan kursor mouse di atas gambar) bisa dilakukan dengan hanya beberapa langkah yang sangat mudah di bawah ini.



Langkah 1



Log in blog => Dashboard => Design => Edit HTML




Langkag 2



Dengan menggunakan keyboard, tekan kekunci F3 atau Ctrl+F. Selanjutnya kopi paste kode berikut ini: ]]>skin> atau kode ]]></b:skin> pada ruang Find dan kemudian tekan Enter.



Langkah 3




Kopi paste kode di bawah tepat di atas atau sebelum kode ]]>skin> atau ]]></b:skin>

.post a:hover img {

width:500px; height:400px; float:middle;

}

Contoh:

.post a:hover img {

width:500px; height:400px; float:middle;

}

]]>skin>

Terakhir, klik Preview dan jika tiada pesan error pada layar, klik Save.



Tambahan: Jika efek zoom in terlalu besar atau kecil, anda boleh mengubah ukuran zoom in tersebut dengan menukar angka pada width: 500px dan height: 400px.




Contoh:



width:550px; height:450px; float:middle;



Itu saja. Selamat mencoba...

Post title : Cara Membuat Simple Zoom Photo
URL post : https://adanggak.blogspot.com/2009/09/cara-membuat-simple-zoom-photo.html