tips & trik Blog Putra Jawilan

Sudah membaca postingan saya yang lalu tentang cara membuat teks marquee, sudah dipraktekan? Kalau sudah ada baiknya anda baca juga yang ini. postingan pendek kali ini masih berkaitan dengan teks marquee namun merupakan pengembangannya, karena efek yang ditampilkan sedikit berbeda dengan marquee pada umumnya. Kalo biasanya teks marquee hanya mempunyai efek bergerak dari atas ke bawah atau kanan ke kiri, namun kali ini kita akan membuat marquee yang bergaya ketikan.

Langkah membuatnya anda tinggal copy kode di bawah ini
<script language="JavaScript1.2">
<!--

/*
Typing Scroller
Submitted by bengaliboy00@hotmail.com (hp: http://www.angelfire.com/nt/bengaliboy/)
With modifications by Dynamicdrive.com
For full source code, usage terms, and 100s more scripts, visit http://dynamicdrive.com
*/

//Secify scroller contents
var line=new Array()
line[1]="Selamat datang di Rizkythea Blog"
line[2]="kumpulan tutorial dan tips blogger..."
line[3]="Blog yang ikut kontes SEO"
line[4]="Stop Dreaming Start Action"
line[5]="dan Rusli Zainal Sang Visioner"

//Specify font size for scoller
var ts_fontsize="16px"

//--Don't edit below this line

var longestmessage=1
for (i=2;i<line.length;i++){
if (line[i].length>line[longestmessage].length)
longestmessage=i
}

//Auto set scroller width
var tscroller_width=line[longestmessage].length

lines=line.length-1 //--Number of lines

//if IE 4+ or NS6
if (document.all||document.getElementById){
document.write('<form name="bannerform">')
document.write('<input type="text" name="banner" size="'+tscroller_width+'"')
document.write(' style="background-color: '+document.bgColor+'; color: '+document.body.text+'; font-family: verdana; font-size: '+ts_fontsize+'; font-weight:bold; border: medium none" onfocus="blur()">')
document.write('</form>')
}

temp=""
nextchar=-1;
nextline=1;
cursor="\"
function animate(){
if (temp==line[nextline] & temp.length==line[nextline].length & nextline!=lines){
nextline++;
nextchar=-1;
document.bannerform.banner.value=temp;
temp="";
setTimeout("nextstep()",1000)}
else if (nextline==lines & temp==line[nextline] & temp.length==line[nextline].length){
nextline=1;
nextchar=-1;
document.bannerform.banner.value=temp;
temp="";
setTimeout("nextstep()",1000)}
else{
nextstep()}}

function nextstep(){

if (cursor=="\"){
cursor="|"}
else if (cursor=="|"){
cursor="/"}
else if (cursor=="/"){
cursor="-"}
else if (cursor=="-"){
cursor="\"}


nextchar++;
temp+=line[nextline].charAt(nextchar);
document.bannerform.banner.value=temp+cursor
setTimeout("animate()",25)}

//if IE 4+ or NS6
if (document.all||document.getElementById)
window.onload=animate
// -->
</script>


Silahkan simpan dimana marqueenya ingin muncul dengan menambah elemen Java Script. Jangan lupa mengganti teks yang becetak tebal dengan yang anda inginkan. Selamat mencoba semoga bermanfaat