Efek Zoom merupakan efek yang menyebabkan gambar membesar pada saat kursor memilih gambar. Efek ini sangat menarik untuk ditampilkan pada blog. Untuk lebih jelasnya bisa anda lihat jika anda telah membuatnya pada blog anda.
Sekarang mari kita lihat langkah-langkahnya, kita mulai dengan:
1. Login ke blogger dengan akun kita sendiri
2. Pilih Rancangan
3. Pilih Edit HTML
4. Cari kode seperti ini ]]></b:skin>
5. Letakkan kode script ini dibatas kode ]]></b:skin>
Sekarang mari kita lihat langkah-langkahnya, kita mulai dengan:
1. Login ke blogger dengan akun kita sendiri
2. Pilih Rancangan
3. Pilih Edit HTML
4. Cari kode seperti ini ]]></b:skin>
5. Letakkan kode script ini dibatas kode ]]></b:skin>
/* Zoom Efek */
.thumbnail{position:relative;z-index:0}
.thumbnail:hover{background-color:transparent;z-index:50}
.thumbnail span{position:absolute;left:-1000px;visibility:hidden;color: black;text-decoration: none}
.thumbnail span img{border-width:0;padding:2px}
.thumbnail:hover span {visibility: visible; top: 0; left: 60px}
6. Jangan Lupa Simpan Template anda..thumbnail{position:relative;z-index:0}
.thumbnail:hover{background-color:transparent;z-index:50}
.thumbnail span{position:absolute;left:-1000px;visibility:hidden;color: black;text-decoration: none}
.thumbnail span img{border-width:0;padding:2px}
.thumbnail:hover span {visibility: visible; top: 0; left: 60px}
Apabila sobat ingin menggunakan efek zoom pada gambar ini, silahkan gunakan kodescript ini:
<a class="thumbnail" href="#thumb"><img src="http://i648.photobucket.com/albums/uu204/puter4/TESTtatobelakangcopy.jpg" border="0" alt="Photobucket"><span><img src="http://i648.photobucket.com/albums/uu204/puter4/TESTtatobelakangcopy.jpg"width ="400px" height="472px";/></span></a>
Untuk text, gunakan kode script seperti ini:<a class="thumbnail" href="#thumb">Lihat Gambar<span><img src= http://i648.photobucket.com/albums/uu204/puter4/TESTtatobelakangcopy.jpg /></span></a>
SOBAT TINGGAL MERUBAH UKURAN GAMBAR YANG SOBAT INGINKAN, TINGGAL MENGGANTI ANGKA DIWIDTH DAN HEIGH SESUAI DENGAN SELERA.
SEDANGKAN UNTUK MENGATUR LETAK TINGGI DAN RENDAH GAMBAR HASIL ZOOM, SOBAT BISA MERUBAH UKURAN PADA KODE YANG DILETAKKAN DI ATAS ]]></B:SKIN> (YANG BERWARNA BIRU)
Jika Anda menyukai Artikel di blog ini, Silahkan
klik disini untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit di Bahasaremajacom
0 Response to "CARA MEMBUAT EFEK ZOOM PADA GAMBAR TERBARU 2016"
Post a Comment
Terimakasih telah membaca artikel yang telah saya berikan. Penulis akan bangga dan mendoakan kebaikan untuk pembacanya :)
Buatlah senang penulis dengan berkomentar :)