Border gambar kelap-kelip

JavaScript ini membuat garis gambar menjadi lebih menarik, seperti dipasang lampu disekelilingnya.



Demo :




Cara membuatnya

Dari Dashboard >> Design >> Edit HTML.


Langkah Pertama

Penempatannya
dibawah <b:skin><![CDATA[
........
diatas ]]></b:skin>

img.flashgroup{border:3px solid black;}

warna black diganti sesuai selera.



Langkah Kedua

Penempatannya sebelum </body>

<script type='text/javascript'>
//<![CDATA[

/*
Script By http://www.javascriptkit.com/script/script2/flashimage.shtml
*/

//Warna garis yang berkelap-kelip
var flashcolor="yellow"
//Kecepatan garis berkelap-kelip (semakin rendah, semakin cepat)
var speed=80

/////No need to edit below here////
var curborder=new Array()
var increment=0
var flashobject=new Array()

if (document.all||document.getElementById){
while (document.getElementById("flash"+increment)!=null){
flashobject[increment]=document.getElementById? document.getElementById("flash"+increment).style : eval("document.all.flash"+increment+".style")
curborder[increment]=0
increment++
}
}


function flash(which){
if (curborder[which]==1){
flashobject[which].borderLeftColor=flashcolor
flashobject[which].borderBottomColor=flashobject[which].borderRightColor
}
else if (curborder[which]==2){
flashobject[which].borderTopColor=flashcolor
flashobject[which].borderLeftColor=flashobject[which].borderBottomColor
}
else if (curborder[which]==3){
flashobject[which].borderRightColor=flashcolor
flashobject[which].borderTopColor=flashobject[which].borderLeftColor
}
else if (curborder[which]==4){
flashobject[which].borderBottomColor=flashcolor
flashobject[which].borderRightColor=flashobject[which].borderTopColor
}

if (curborder[which]<=3)
curborder[which]++
else
curborder[which]=1
}

if (document.all||document.getElementById){
for (z=0;z<flashobject.length;z++){
var temp='setInterval("flash('+z+')",'+speed+')'
eval(temp)
}
}

//]]>
</script>


Langkah Ketiga

<img src='URL gambar anda' id='flash0' class='flashgroup' />

Setiap memasang gambar di Blogspot anda, tambahkan id dan class seperti diatas. Jika gambar lebih dari satu, id jangan sampai sama, ganti saja seperti :

<img src='URL gambar anda' id='flash0' class='flashgroup' />
<img src='URL gambar anda' id='flash1' class='flashgroup' />
<img src='URL gambar anda' id='flash2' class='flashgroup' />

begitu saja seterusnya.




Credit : JavaScript Kit

Alhamdulillah

0 comments:


Posting Komentar


Creative Commons License
Border gambar kelap-kelip by Nano Yulianto is licensed under a Creative Commons Attribution 3.0 Unported License.
Based on a work at http://nanoyulianto.blogspot.com/2011/01/border-gambar-kelap-kelip.html.
Permissions beyond the scope of this license may be available at http://nanoyulianto.blogspot.com/.