 |
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="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiy5t4wVjPevjG1U88QHKhFUKvGY0mPgAUb9tczhuojdbVdI45Z0TlId8rZ4vWs3aWxcWADF0IZXfUtdbWLYRaB05Nr8p81SxYGfQ6j6TjpTyxw8nJxQHXL6IyrBzsJHkMbN0qFGl4zFUyb/s1600/Black_green.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="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiy5t4wVjPevjG1U88QHKhFUKvGY0mPgAUb9tczhuojdbVdI45Z0TlId8rZ4vWs3aWxcWADF0IZXfUtdbWLYRaB05Nr8p81SxYGfQ6j6TjpTyxw8nJxQHXL6IyrBzsJHkMbN0qFGl4zFUyb/s1600/Black_green.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.
No comments:
Post a Comment