Cara Membuat Efek Kaca Pembesar Pada Gambar Postingan Blog

Semua-Niche|Membuat Efek Kaca Pembesar Pada Gambar Postingan Blog,Disini ada
yang punya masalah seperti gambar yang anda update di dalam postingan tidak terlihat ?
mau dibesarkan tidak muat dengan ruang postingan ? , tenang saja kali ini saya akan
menyelesaikan masalah anda,Dengan membuat efek kaca pembesar/zoom di blog anda.

Pembuatan efek ini berfungsi untuk gambar yang mungkin tidak terlihat karena ukuran yang kecil
sementara sang pemilik tidak mempunyai ruang yang pas dengan gambar,Sehingga gambar di
buat kecil

Langkah Pembuatan :

1.Masuk Ke Dalam Blog Anda

2.Cari Kode ]]></b:skin> dalam blog anda

3.Letakan kode dibawah ini diatas kode tersebut :

* {margin: 0; padding: 0;}
.magnify {width: 200px; margin: 50px auto; position: relative;}
.large {
 width: 245px; height: 245px;
 position: absolute;
 border-radius: 100%;
 box-shadow: 0 0 0 7px rgba(255, 255, 255, 0.85),
 0 0 7px 7px rgba(0, 0, 0, 0.25),
 inset 0 0 40px 2px rgba(0, 0, 0, 0.25);
 background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJ70GbhQ0HcPqFCHAV9CZwZ-_W55r6SiU1z1X2cAMNVD0mIELsGxYnR1To28i2P1rRCdrjUu3-2xdTa_EQEEd2MwUwkBgGk_vmRV8H4GHK228VXABnaif_USDOdXDuH524fuHGl8yQjfc/s1600/seocips-image-effect-demo.jpg') no-repeat;
 display: none;
}
.small { display: block; }

Silahkan anda ganti URL gambar dengan URL gambar anda

4.Langkah Selanjutnya,Silahkan Taruh Script Dibawah Apabila Ingin Menaruh Gambar Di Postingan

<div class="magnify">
 <div class="large"></div>
 <img class="small" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJ70GbhQ0HcPqFCHAV9CZwZ-_W55r6SiU1z1X2cAMNVD0mIELsGxYnR1To28i2P1rRCdrjUu3-2xdTa_EQEEd2MwUwkBgGk_vmRV8H4GHK228VXABnaif_USDOdXDuH524fuHGl8yQjfc/s1600/seocips-image-effect-demo.jpg" width="200"/>
</div>

5.Silahkan Letakan kode dibawah ini diatas kode </head> atau </body>

<script src="https://sites.google.com/site/seocips/seocips-script/prefixfree1.js" type="text/javascript"></script>
<script src="https://sites.google.com/site/seocips/seocips-script/prefixfree2.js" type="text/javascript"></script>
<script src="https://sites.google.com/site/seocips/seocips-script/jquery-1.7.1.min.js" type="text/javascript"></script>