![]() |
Scholovers Blogger | Cara membuat zoom Image yang melayang saat gambar disentuh mouse, yaitu dengan masuk ke Edit HTML/rancangan HTML, cari kode </head> letakkan kode di bawah ini di atas kode </head> lalu save:
<script src='http://semipedia.googlecode.com/files/semipedia-overview-zoomimage.js'type='text/javascript'/>
<script src=' http://semipedia.googlecode.com/files/ZoomimagePreview.js' type='text/javascript'/>
<style type='text/css'>
#preview{
position:absolute;
border:2px solid #fff;
background:# 959595;
padding:11px;
display:block;
color:#000;
font-weight:bold;
text-align:center;
}
</style>
Setelah selesai masukkan gambar pada postingan anda masukkan kode HTML di Bawah ini di post HTML
<div dir="ltr" style="text-align: left;" trbidi="on">
<table cellpadding="0" cellspacing="0" class="tr-caption-container" style="float: right; margin-left: 1em; text-align: right;"><tbody>
<tr><td style="text-align: center;"><a class="preview" href="http://www.blooger.co.id"><p><img src="http://s22.postimg.org/brou1od1t/Scholovers_Logo.png" imageanchor="1" style="clear: right; margin-bottom: 1em; margin-left: auto; margin-right: auto;" title="black green"><img alt="black green" border="0" height="320" src="http://www.blooger.co.id"><p><img src="http://s22.postimg.org/brou1od1t/Scholovers_Logo.png" width="212" /></a></td></tr>
<tr><td class="tr-caption" style="text-align: center;"><br />
Black Green</td></tr>
</tbody></table>
Ganti warna merah dengan URL gambar anda, dan ganti warna biru dengan title gambar tersebut. hasilnya akan seperti gambar di bawah di atas. Semoga berhasil.
0 Response to "Cara membuat zoom Image yang melayang saat gambar disentuh mouse"
Post a Comment