Pausing Up-down Message adalah script yang mampu membuat pesan yang kita tampilkan bergerak ke atas dan berhenti secara stabil pada tenggang waktu yang teratur pada pesan-pesan yang kita tampilkan. Pausing Up-down bisa diisi dengan beberapa pesan, bahkan gambar yang bergerak bergiliran ke atas. Script ini sangat efektif untuk menampilkan, katakanlah sponsor, atau iklan yang kita tampilkan di sisi sidebar website kita.
Script ini dibuat oleh Dynamic Drive. Sebenarnya cara menginstall javascript dynamic drive tidak terlalu sulit, anda cukup menempelkan script 4.5 ini pada bagian tertentu yang akan dipasang scroller. Selanjutnya anda bisa memodifikasi link-link yang ada pada pesan tersebut.
<script language="JavaScript1.2">
/*
Pausing updown message scroller-
© Dynamic Drive (www.dynamicdrive.com)
For full source code, installation instructions,
Terms Of Use, visit http://www.dynamicdrive.com
*/
//configure the below five variables to change the style of the scroller
var scrollerwidth='150px'
var scrollerheight='105px'
var scrollerbgcolor='lightyellow'
//set below to '' if you don't wish to use a background image
var scrollerbackground='scrollerback.gif'
//configure the below variable to change the contents of the scroller
var messages=new Array()
messages[0]="<font face='Arial'><a href='http://www.dynamicdrive.com'>Click here to go back to Dynamicdrive.com frontpage</a></font>"
messages[1]="<font face='Arial'><a href='http://javascriptkit.com'>Visit JavaScriptKit for award winning JavaScript tutorials</a></font>"
messages[2]="<font face='Arial'><a href='http://www.codingforums.com'>Get help on scripting and web development. Visit CodingForums.com!</a></font>"
messages[3]="<font face='Arial'><a href='http://www.freewarejava.com'>Looking for Free Java applets? Visit Freewarejava.com!</a></font>"
messages[4]="<font face='Arial'><a href='http://dynamicdrive.com/link.htm'>If you find this script useful, please click here to link back to Dynamic Drive!</a></font>"
///////Do not edit pass this line///////////////////////
var ie=document.all
var dom=document.getElementById
if (messages.length>2)
i=2
else
i=0
function move1(whichlayer){
tlayer=eval(whichlayer)
if (tlayer.top>0&&tlayer.top<=5){
tlayer.top=0
setTimeout("move1(tlayer)",3000)
setTimeout("move2(document.main.document.second)",3000)
return
}
if (tlayer.top>=tlayer.document.height*-1){
tlayer.top-=5
setTimeout("move1(tlayer)",50)
}
else{
tlayer.top=parseInt(scrollerheight)
tlayer.document.write(messages[i])
tlayer.document.close()
if (i==messages.length-1)
i=0
else
i++
}
}
function move2(whichlayer){
tlayer2=eval(whichlayer)
if (tlayer2.top>0&&tlayer2.top<=5){
tlayer2.top=0
setTimeout("move2(tlayer2)",3000)
setTimeout("move1(document.main.document.first)",3000)
return
}
if (tlayer2.top>=tlayer2.document.height*-1){
tlayer2.top-=5
setTimeout("move2(tlayer2)",50)
}
else{
tlayer2.top=parseInt(scrollerheight)
tlayer2.document.write(messages[i])
tlayer2.document.close()
if (i==messages.length-1)
i=0
else
i++
}
}
function move3(whichdiv){
tdiv=eval(whichdiv)
if (parseInt(tdiv.style.top)>0&&parseInt(tdiv.style.top)<=5){
tdiv.style.top=0+"px"
setTimeout("move3(tdiv)",3000)
setTimeout("move4(second2_obj)",3000)
return
}
if (parseInt(tdiv.style.top)>=tdiv.offsetHeight*-1){
tdiv.style.top=parseInt(tdiv.style.top)-5+"px"
setTimeout("move3(tdiv)",50)
}
else{
tdiv.style.top=parseInt(scrollerheight)
tdiv.innerHTML=messages[i]
if (i==messages.length-1)
i=0
else
i++
}
}
function move4(whichdiv){
tdiv2=eval(whichdiv)
if (parseInt(tdiv2.style.top)>0&&parseInt(tdiv2.style.top)<=5){
tdiv2.style.top=0+"px"
setTimeout("move4(tdiv2)",3000)
setTimeout("move3(first2_obj)",3000)
return
}
if (parseInt(tdiv2.style.top)>=tdiv2.offsetHeight*-1){
tdiv2.style.top=parseInt(tdiv2.style.top)-5+"px"
setTimeout("move4(second2_obj)",50)
}
else{
tdiv2.style.top=parseInt(scrollerheight)
tdiv2.innerHTML=messages[i]
if (i==messages.length-1)
i=0
else
i++
}
}
function startscroll(){
if (ie||dom){
first2_obj=ie? first2 : document.getElementById("first2")
second2_obj=ie? second2 : document.getElementById("second2")
move3(first2_obj)
second2_obj.style.top=scrollerheight
second2_obj.style.visibility='visible'
}
else if (document.layers){
document.main.visibility='show'
move1(document.main.document.first)
document.main.document.second.top=parseInt(scrollerheight)+5
document.main.document.second.visibility='show'
}
}
window.onload=startscroll
</script>
<ilayer id="main" width=&{scrollerwidth}; height=&{scrollerheight};
bgColor=&{scrollerbgcolor}; background=&{scrollerbackground}; visibility=hide>
<layer id="first" left=0 top=1 width=&{scrollerwidth};>
<script language="JavaScript1.2">
if (document.layers)
document.write(messages[0])
</script>
</layer>
<layer id="second" left=0 top=0 width=&{scrollerwidth}; visibility=hide>
<script language="JavaScript1.2">
if (document.layers)
document.write(messages[dyndetermine=(messages.length==1)? 0 : 1])
</script>
</layer>
</ilayer>
<script language="JavaScript1.2">
if (ie||dom){
document.writeln('<div id="main2"
style="position:relative;
width:'+scrollerwidth+';height:'+scrollerheight+';overflow:hidden;background-color:'+scrollerbgcolor+' ;background-image:url('+scrollerbackground+')">')
document.writeln('<div style="position:absolute;
width:'+scrollerwidth+';
height:'+scrollerheight+';clip:rect(0 '+scrollerwidth+' '+scrollerheight+'
0);left:0px;top:0px">')
document.writeln('<div id="first2"
style="position:absolute;
width:'+scrollerwidth+';left:0px;top:1px;">')
document.write(messages[0])
document.writeln('</div>')
document.writeln('<div id="second2" style="position:absolute;
width:'+scrollerwidth+';left:0px;top:0px;visibility:hidden">')
document.write(messages[dyndetermine=(messages.length==1)? 0 : 1])
document.writeln('</div>')
document.writeln('</div>')
document.writeln('</div>')
}
</script>
Jika ingin memasang script Pausing Up-down Message pada blogspot, maka sign in ke blogspot, klik Element Halaman >> Layout>> Add Gadget. Dan paste kode script di atas ke posisi mana yang ingin dibuat.
Selamat mencoba.
Tags:
Javascript