Membuat Efek Gambar Bergetar di Blog

Efek Gambar Bergetar di Blog. Berikut ini seocips akan membagikan tentang Cara Membuat Efek Gambar Bergetar di Blog. Jadi untuk sobat yang suka memsang efek-efek tertentu di blognya mungkin dapat mencoba memasang efek gambar bergetar seperti ini.

Efek seperti ini mungkin sudah pernah sobat lihat di blog-blog lainnya, dan efek berikut ini berbeda dengan efek gambar dengan panel description yang telah dibahas sebelumnya. Apakah sobat tertarik ingin membuat efek gambar bergetar di blog sobat? script yang dapat sobat gunakan.

DEMO

Membuat Efek Gambar Bergetar di Blog

<script type="text/javascript">
var rector=8
var stopit=0
var a=1
function init(which){
stopit=0
shake=which
shake.style.left=0
shake.style.top=0
}
function rattleimage(){
if ((!document.all&&!document.getElementById)||stopit==1)
return
if (a==1){
shake.style.top=parseInt(shake.style.top)+rector+"px"
}
else if (a==2){
shake.style.left=parseInt(shake.style.left)+rector+"px"
}
else if (a==3){
shake.style.top=parseInt(shake.style.top)-rector+"px"
}
else{
shake.style.left=parseInt(shake.style.left)-rector+"px"
}
if (a<4)
a++
else
a=1
setTimeout("rattleimage()",10)
}
function stoprattle(which){
stopit=1
which.style.left=0
which.style.top=0
}
document.write('<style>.gambargetar{position:relative;}</style>')
</script>

Untuk menampilkannya di dalam postingan misalnya, sobat dapat menggunakan kode di bawah ini, dan untuk kode berwarna biru silahkan ganti dengan url gambar sobat.

EFFECT PELAN

<img class="gambargetar" src="URL GAMBAR" onclick="top.focus()" onmouseout="stoprattle(this);top.focus()" onmouseover="init(this);rattleimage()" />

EFFECT CEPAT

<img class="gambargetar" src="URL GAMBAR" onmouseover="init(this);rattleimage()" onmouseout="stoprattle(this);top.focus()" onclick="top.focus()" />

Ok sobat sekian tutorial blog yang dapat dibagikan hari ini dan jangan lupa lihat artikel terbaru seocipslainnya. Semoga Cara Membuat Efek Gambar Bergetar di Blog Blogger ini bermanfaat.