Sabtu, 24 November 2012

[TUTORIAL] Efek Zoom Pada Image Didalam Post




Hai guys kali ini gue mau buat tutorial nih buat kalian,sebenarnya akhir"akhir ini gue sibuk banget sumvee ane jujur :D,why??karena tugas kuliah gue kian menumpuk dan juga sedang dalam pembuatan judul buat skripsi,dan mau uas juga pulua ,arghh gimana gak sakau nih badan :D,ok skip aja curcolnya langsung ke intinya ..

tutorial gambar membesar,jadi kalau kalian arahkan kursornya ke gambar yang ada di postingan kamu,dia akan zoom dengan sendirinya ,dan kalau kalian geser dari gambar kursornya ,akan mengecil seperti sedia kala ,yuu capcuss aja ^_^


  • pertama-tama kalian klik bagian blog kamu seperti diatas

  • kemudian pilih Template seperti nomor 1 itu
  • setelah muncul kalian pilih lagi bagian Edit HTML seperti nomor 2 di atas

  • klik
  • (klik ctrl+F) untuk mempermudah mencarinya)
  • taruh tulisan di bawah ini dibawah tulisan <head> tadi
  •  <style>
    .post img:hover {
    -o-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -moz-transform: scale(1.3);
    -o-transform: scale(1.2);
    -webkit-transform: scale(1.2);
    </style>
    untuk mencegah erorr di blog kalian,klik preview dahulu/pratinjau,kalau sudah berhasil tinggal klik save,dan selesaii ^_^ ,dan hasilnya akan seperti di bawah ini,jika terkena kursornya ...,selamat mencoba yaa ^_^
kalau masih ada yang bingung boleh bertanya,ohya..tutorial ini  berfungsi buat template yang sudah disediakan oleh blogspot ya,kalau yang boleh download dari free templates berbagai tempat,aku gak tau hihi ,see yaa..

5 komentar:

  1. ohh nice tutorial :D kebetulan nih saudaraku lagi cari cara gmn bisa buat kyk gini. thanks :D

    visit my blog ^^
    www.luchluchcraft.blogspot.com

    BalasHapus
  2. Aku nominasiin kamu disini http://beautifyiu.blogspot.com/2012/11/first-liebster-award.html

    BalasHapus
  3. Nice Tutorial. Aku baru tau kalo ini diatur di html template. Makasih ya, udah share. :D

    BalasHapus
  4. hai via aku tag kamu disini ya http://ameliasweetcaramel.blogspot.com/2012/11/my-first-liebster-award.html

    BalasHapus
  5. wahh so thx.. di tunggu yang lain ya..

    BalasHapus