Kumpulan Trick Blog TErbaru

About

New Trick hayalah blog kecil yang mencoba untuk memberikan dan menyajikan trick dan tips tentang blog
Selasa, 16 Februari 2016

Cara Memberikan Efek Memperbesar (Zoom) Gambar Blog

Cara Memberikan Efek Memperbesar (Zoom) Gambar Blog memiliki keuntungan tersendiri yaitu menghemat ruang artikel pada tulisan blog dan selain itu memberikan efek memperbesar gambar blog juga mempercepat proses loading blog. Berapa pun banyaknya gambar yang ingin ditampilkan kedalam artikel tidak akan pernah jadi masalah dan sobat juga tidak perlu kwuatir terhadap loading blog sobat karena saat proses loading berjalan, yang terbaca adalah gambar kecil yang telah diatur sebelumnya.

Cara memberikan efek memperbesar (zoom) gambar blog ini telah saya gunakan pada salah satu artikel saya yang menggunakan banyak gambar dan bisa sobat lihat di cara mengetahui kode template atau pada contoh tampilan gambar berikut ini

Cara Memberikan Efek Memperbesar (Zoom) Gambar Blog
Demonya
Silahkan arahkan kursor mouse ke gambar berikut ini

Cara Memperbesar Gambar Blog

Untuk membuat efek memperbesar gambar blog seperti demo diatas, silahkan ikuti caranya sebagai berikut. Dan jika sobat tidak tertarik menggunakan efek zoom gambar blog ini, saya juga telah membuat trik lainnya yang bisa sobat baca di Cara Memperbesar Gambar Blog

Berikut Cara Memberikan Efek Memperbesar (Zoom) Gambar Blog
  1. Masuk ke akun blogger sobat
  2. Pilih menu Template >> Edit Html >> tekan Ctrl+F pada keyboard
  3. Cari kode </head>
  4. Letakkan kode berikut diatas </head>
    <script src="http://yourjavascript.com/29031127131/zoomeffectpict.js" type="text/javascript"></script>
    <script src="http://yourjavascript.com/82412173123/zoomeffectpict1.js" type="text/javascript"></script>
    <style>#preview{position:absolute;border:1px solid #ccc;background:#333;padding:5px;display:none;color:#fff;}</style>

  5. Simpan template
  6. Setelah memasang kode diatas kedalam template blog sobat, gunakan kode berikut setiap kali sobat ingin memberikan efek memperbesar gambar blog kedalam artikel atau postingan

    <a class="preview" href="Ulr Gambar Besar" title="Judul Gambar"><img alt="gallery thumbnail" height="110" src="Ulr Gambar Besar Tapi Kecil" width="170" /></a>

    Keterangan
    • Ulr Gambar Besar : Ukuran asli dari gambar
    • Ulr Gambar Besar Tapi Kecil : Ukuran asli dari gambar yang sudah memiliki ukuran kecil karena sudah memiliki skala 110 untuk tinggi gambar dan 170 untuk lebar gambar
    • height="110" : Ukuran tinggi gambar
    • width="170" : Ukuran lebar gambar
    • Untuk kode JavaScript, jika ia tidak bekerja atau kadaluarsa karena gangguan host, silahkan baca panduannya Disini atau tinggalkan komentar
    • Atau pastikan didalam template sobat sudah terpasang kode javascript dari Jquery. Jika belum, silahkan ambil kodenya di Jquery.com yang saat sudah berada pada versi 1.9

Demikian cara memberikan efek memperbesar (zoom) gambar blog yang mungkin bisa sobat gunakan dan semoga bermanfaat. Jika ada kesalahan, silahkan berkomentar untuk artikel ini, cara memberikan efek memperbesar (zoom) gambar blog




Klik untuk melihat kode: :) =( :s :D :-D ^:D ^o^ 7:( :Q :p T_T @@, :-a :W *fck* x@

TOP