Cara membuat gambar membesar saat di arahkan cursor

Published by Byrdty Rabu, 13 Mei 2015

Cara membuat gambar membesar saat di arahkan cursor

Tips mempercantik blog dengan cara membuat gambar membesar saat di arahkan cursor

bayu-tutor.-Pada kesempatan kali ini,saya akan membagikan cara mempercantik blog dengan Cara

membuat gambar membesar saat di arahkan cursor.Tujuan utama nya adalah agar pengunjung situs kita tidak perlu repot-repot mengklik gambar supaya gambar nya besar,dan membuat blog menjadi lebih elegan.

Langsung saja ikuti cara nya di bawah ini.

1. Masuk ke Blog kalian
2. Pilih situs mana yang akan di beri gambar membesar otomatis
3. Pilih template
4. Pilih Sesuaikan/Customize
5. Pilih Tingkat Lanjut/Advance
6. Tekan Add CSS
7. Copy Paste kode berikut di Add CSS/Tambahkan CSS

Kode.  

.post img, table.tr-caption-container { border:none; max-width:560px; height:auto; -o-transition: all 0.5s; -moz-transition: all 0.5s; -webkit-transition: all 0.5s; } .post img:hover { -o-transition: all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transform: scale(1.5); -o-transform: scale(1.5); -webkit-transform: scale(1.5); -webkit-border-radius: 0px 0px; -moz-border-radius: 0px / 0px; -webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.6); }

Lalu tekan Apply/Terapkan di Blo.Dan lihat hasilnya

Cukup sekian,semoga bermanfaat.Apabila ada yang perlu ditanyakan silahkan beri komentarnya.