Minggu, 25 Desember 2011

Membuat Teks Berubah-Ubah

oke sob,,,walau blog ini masih jelek..tpi gpp lah,,(blog ini masih baru) dan blog ini saya khusus kan utk Tutorial Blogger... >>>>Blogger Home<<<<
,,
kali ini saya akan bahas ttng Membuat Teks Berubah-Ubah ,, langsung aja , ini contohnya



gmn? tertarik??langsung aja:
  • masuk ke blog
  • Rancangan (Tata Letak)
  • Edit HTML, cari kode <body> Taruh script berikut di bawah <body>
  • berikut ini scrip nya:
 <script type="text/javascript">





//Bagian edit tulisan yang bakal keluar.
var tickercontents=new Array()
tickercontents[0]='Ini Contoh doank!'
tickercontents[1]='rechkerweb.blogspot.com'

var tickerwidth="200px"
var tickerheight="70px"
var fontcss="font: bold 14px Verdana; color:black"
var tickdelay=3000 //delay btw messages
var highlightspeed=2 //2 pixels at a time.
var highlightcolor="lightyellow"
var backdroptextcolor="#E1E1E1"



document.write('<style>#highlighterbg a{color:'+backdroptextcolor+'}</style>')
document.write('<div style="position:relative;left:0px;top:0px; width:'+tickerwidth+'; height:'+tickerheight+';'+fontcss+'">')
document.write('<span id="highlighterbg" style="position:absolute;left:0;top:0;color:'+backdroptextcolor+'; width:'+tickerwidth+'; height:'+tickerheight+';padding: 4px"></span><span id="highlighter" style="position:absolute;left:0;top:0;clip:rect(auto auto auto 0px); background-color:'+highlightcolor+'; width:'+tickerwidth+';height:'+tickerheight+';padding: 4px"></span>')
document.write('</div>')

var currentmessage=0
var clipbottom=1

function changetickercontent(){
msgheight=clipbottom=crosstick.offsetHeight
crosstick.style.clip="rect("+msgheight+"px auto auto 0px)"
crosstickbg.innerHTML=tickercontents[currentmessage]
crosstick.innerHTML=tickercontents[currentmessage]
highlightmsg()
}

function highlightmsg(){
//var msgheight=crosstick.offsetHeight
if (clipbottom>0){
clipbottom-=highlightspeed
crosstick.style.clip="rect("+clipbottom+"px auto auto 0px)"
beginclip=setTimeout("highlightmsg()",20)
}
else{
clipbottom=msgheight
clearTimeout(beginclip)
if (currentmessage==tickercontents.length-1) currentmessage=0
else currentmessage++
setTimeout("changetickercontent()",tickdelay)
}
}

function start_ticking(){
crosstickbg=document.getElementById? document.getElementById("highlighterbg") : document.all.highlighterbg
crosstick=document.getElementById? document.getElementById("highlighter") : document.all.highlighter
crosstickParent=crosstick.parentNode? crosstick.parentNode : crosstick.parentElement
if (parseInt(crosstick.offsetHeight)>0)
crosstickParent.style.height=crosstick.offsetHeight+'px'
else
setTimeout("crosstickParent.style.height=crosstick.offsetHeight+'px'",100) //delay for Mozilla's sake
changetickercontent()
}

if (document.all || document.getElementById)
window.onload=start_ticking

</script>

NB: kode warna merah , ganti dgn kesukaan anda..

semoga bermanfaat..

Tidak ada komentar:

Posting Komentar