Thursday, February 6, 2014

Cara Membuat Efek Auto Zoom Image View Pada Blog

auto-zoom-image
Membuat Efek Auto Zoom Image View - Efek auto zoom image view, maksudnya adalah jika kita mengarahkan cursor (pointer cursor) ke arah gambar maka secara otomatis gambar tersebut akan mengalami zoom (perbesaran ukuran). Hal ini dapat memberikan keunikan dan membuat daya tarik blog anda menjadi lebih bagus. Namun tetap ingat! Pastikan blog anda tidak memasang terlalu banyak widget atau pernak-pernik yang berbobot sedang atau bahkan berat. Karena jika hal itu tidak anda pedulikan dan anda tetap memasangnya secara berlebihan, maka bukan hasil yang bagus yang akan anda dapatkan. Justru hasilnya akan buruk dan berdampak negatif pada kualitas blog anda khususnya pada waktu loading.

Berikut tutorial  Cara Membuat Efek Auto Zoom Image View di Blog :


1. Login ke blogger.com menggunakan akun anda.
2. Masuk ke halaman "Template".

menu-template-blogger-ngeposta

3. Lalu pilih "Edit HTML", klik "Lanjutkan" dan jangan lupa centang "Expand Template Widget".

ngeposta-edit-html

4. Kemudian cari kode ]]></b:skin> (gunakan Ctrl+F untuk mencarinya) dan letakkan script CSS berikut ini tepat di atasnya!

?
1
2
3
4
5
6
7
8
9
10
.post img:hover {
-moz-transition: all 0.3s;
-webkit-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
-moz-transform: scale(1.3);
-webkit-transform: scale(1.3);
-o-transform: scale(1.3);
transform: scale(1.3);
}

5. Lalu klik save/simpan template, selesai...

Sekian tutorial Cara Membuat Efek Auto Zoom pada gambar di Blog saat di sentuh mouse. Semoga bermanfaat. Sampai jumpa pada tutorial-tutorial lainnya. Salam brainword21.. Jangan lupa tulis komentarmu ya, agar kami bisa lebih baik lagi dalam mengeposkan di blog ini..

2 comments:

  1. Terima Kasih Tutorialnya Sangat Bermanpaat bagi saya dan sekarang saya sudah mencobanya dan hasilnya keren sekali agan boleh mampir ke blog saya hehhe Toko Blog Net

    ReplyDelete
    Replies
    1. Terimakasih Telah Berkunjung.. :) Semoga dapat membantu :)

      Delete