cara membuat gambar zoom | contoh makalah

 cara membuat zoom pada blog.. langsung ke intinya gan..


Berikut Caranya:

Login ke blogmu, lalu pilih menu "Rancangan"" --> "Edit HTML", kemudian centang pada box "Expand Template Widget".

Carilah kode ]]>, untuk mempersingkatnya gunakan fasilitas ctrl + f dan jika sudah ketemu, copy dan pastekan kode dibawah ini tepat diatas kode ]]>.

.hovergallery 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}.hovergallery img:hover{-webkit-transform:scale(1.1);-moz-transform:scale(1.1);-o-transform:scale(1.1);box-shadow:0px 0px 30px gray;-webkit-box-shadow:0px 0px 30px gray;-moz-box-shadow:0px 0px 30px gray;opacity:1}

Simpanlah template sobat.

Untuk memasukkan efeknya pada gambar maka copy-pastekan kode berikut pada postingan atau widget yang dimana sobat ingin menaruh gambar yang akan diberi efek. Berikut kodenya:

<div class="hovergallery"> Gambar sobat </div>

Ganti teks berwarna merah dengan link dari gambar sobat. Contohnya seperti dibawah ini:

                       <div class="hovergallery"> http://i44.tinypic.com/2rpqyp0.gif </div>

     jadinya begini gan... ini bisa dimasuukkan di widget juga asyikdah....

 arsip pribadi:
  sumber : http://mampirbro.blogspot.com/2011/09/efek-gambar-zoom-jika-dilalui-cursor.html