☰
Home About Blogger Efek Zoom/ Memperbesar Gambar Pada Posting Blog

Efek Zoom/ Memperbesar Gambar Pada Posting Blog




Sudah lama nih saya ga posting mengenai Edit HTML Blog.
Tidak mau banyak basa-basi langsung saja saya akan memberikan sedikit ilmu yang sekiranya bisa bermanfa'at yaitu bagaimana caranya agar gambar pada artikel/postingan blog membesar/zoom otomatis ketika kursor diarahkan pada gambar tersebut.

Sebagai contoh silahkan kalian arahkan kursor pada gambar dibawah ini:


Gimana gan, zoom otomatis kan gambarnya ketika kursor diarahkan..??


PERHATIAN:
Back Up terlebih dahulu HTML asli, untuk menghindari jika proses gagal.

Jika kalian tertarik silahkan ikuti langkahnya berikut ini:
  1. Masuk ke Blogger
  2. Pilih Template > Edit HTML
  3. Cari kode ]]></b:skin> (tekan "Ctrl+F" untuk mempermudah menemukan kode)
  4. Copy kode CSS dibawah ini, lalu Paste diatas kode ]]></b:skin>
    5. .post 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 2px 2px 0;
    }
    .post img:hover{
    -webkit-transform:scale(1.1);
    -moz-transform:scale(1.1);
    -o-transform:scale(1.1);
    opacity: 1;
    }
  5. Simpan Template


Baca juga Efek Gambar Berputar Dan Zoom Otomatis Pada Posting Blog



Semoga Bermanfa'at


Related Post