Membuat Efek Zoom Image Pada Blog

HMPS TI UNIKAMA - Website Resmi HMPS Teknik Informatika Universitas Kanjuruhan Malang.

Berikut ini akan kami beritahukan sedikit triks untuk memperindah tampilan blog anda terutama pada postinganya. Efek zoom pada image yang ada pada postingan tentunya juga akan mempercantik tampilan blog anda,  cara kerjanya adalah jika cursor didekatkan dalam area image maka akan terjadi mouse over yaitu membuat besar Gambar tersebut (zoom).

Contohnya silahkan dekatkan cursor anda kegambar dibawah ini :
Berikut ini langkah-langkah nya :
  • Silahkan Anda login ke blogger Anda masing-masing
  • Masuk kebagian Rancangan, dan klik bagian Edit HTML, kemudian beri tanda centang pada bagian Expand Template Widget
  • Cari kode ]]></b:skin>, gunakan shortcut keyboard Ctrl + F
  • Setelah ketemu copy paste kode CSS berikut tepat diatas kode tadi
.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.3);
-webkit-transform: scale(1.3); }
  • Setelah anda paste (ctrl+v) kan silahkan save template blog anda.
Selesai, Semoga bermanfaat.

No comments:

Post a Comment

Terimakasih Atas Komentar Anda, Salam JOSS dari HMPS TI UNIKAMA

Pages