Variasi Pada Titlebar

Apa itu titlebar?
Itu lho, tulisan paling atas di browser kita, judul yang muncul klo lagi buka satu web.
* pasti pada tau sih ~(-_-~) *
Kali ini aku mau share cara biar bisa mengganti titlebar itu jadi lebih variatif dan atraktif (?)
Ada dua versi nih...

Sebelum na, coba liat site sederhana berikut yang khusus dibikin biar memperjelas tutor kali ini...

VERSI 1
VERSI 2
Itu site isi na ga ada apa-apa, soal na emang buat demo titlebar aja XD
Gimana? Perhatikan tulisan titlebar na yang berubah-ubah. Pengen nyoba?

Copas script berikut sebelum </head>

VERSI 1

<script>
//TITLEBAR
function tb8_makeArray(n){
this.length = n;
return this.length;
}

tb8_messages = new tb8_makeArray(3);
tb8_messages[0] = "Now you are connected with [L]ain";
tb8_messages[1] = "No matter where you are, everyone is always connected";
tb8_messages[2] = "And you don't seem to understand...";
tb8_rptType = 'infinite';
tb8_rptNbr = 5;
tb8_speed = 100;
tb8_delay = 1000;
var tb8_counter=1;
var tb8_currMsg=0;
var tb8_tekst ="";
var tb8_i=0;
var tb8_TID = null;
function tb8_pisi(){
tb8_tekst = tb8_tekst + tb8_messages[tb8_currMsg].substring(tb8_i, tb8_i+1);
document.title = tb8_tekst;
tb8_sp=tb8_speed;
tb8_i++;
if (tb8_i==tb8_messages[tb8_currMsg].length){
tb8_currMsg++; tb8_i=0; tb8_tekst="";tb8_sp=tb8_delay;
}
if (tb8_currMsg == tb8_messages.length){
if ((tb8_rptType == 'finite') && (tb8_counter==tb8_rptNbr)){
clearTimeout(tb8_TID);
return;
}
tb8_counter++;
tb8_currMsg = 0;
}
tb8_TID = setTimeout("tb8_pisi()", tb8_sp);
}
tb8_pisi()
// -->
</script>

VERSI 2

<script>
//TITLEBAR
function tb9_makeArray(n){
this.length = n;
return this.length;
}

tb8_messages = new tb8_makeArray(3);
tb9_messages[0] = "Now you are connected with [L]ain";
tb9_messages[1] = "No matter where you are, everyone is always connected";
tb9_messages[2] = "And you don't seem to understand...";
tb8_rptType = 'infinite';
tb8_rptNbr = 5;
tb9_speed = 100;
tb9_delay = 1000;
var tb9_counter=1;
var tb9_currMsg=0;
var tb9_timerID = null
var tb9_bannerRunning = false
var tb9_state = ""
tb9_clearState()
function tb9_stopBanner() {
if (tb9_bannerRunning)
clearTimeout(tb9_timerID)
tb9_timerRunning = false
}
function tb9_startBanner() {
tb9_stopBanner()
tb9_showBanner()
}
function tb9_clearState() {
tb9_state = ""
for (var i = 0; i < tb9_messages[tb9_currMsg].length; ++i) {
tb9_state += "0"
}
}
function tb9_showBanner() {
if (tb9_getString()) {
tb9_currMsg++
if (tb9_messages.length <= tb9_currMsg) {
if ((tb9_rptType == 'finite') && (tb9_counter==tb9_rptNbr)){
tb9_stopBanner();
return;
}
tb9_counter++;
tb9_currMsg=0;
}
tb9_clearState()
tb9_timerID = setTimeout("tb9_showBanner()", tb9_delay)
}
else {
var tb9_str = ""
for (var j = 0; j < tb9_state.length; ++j) {
tb9_str += (tb9_state.charAt(j) == "1") ? tb9_messages[tb9_currMsg].charAt(j) : "____"
}
document.title = tb9_str
tb9_timerID = setTimeout("tb9_showBanner()", tb9_speed)
}
}
function tb9_getString() {
var full = true
for (var j = 0; j < tb9_state.length; ++j) {
if (tb9_state.charAt(j) == 0)
full = false
}
if (full) return true
while (1) {
var num = tb9_getRandom(tb9_messages[tb9_currMsg].length)
if (tb9_state.charAt(num) == "0")
break
}
tb9_state = tb9_state.substring(0, num) + "1" + tb9_state.substring(num + 1, tb9_state.length)
return false
}
function tb9_getRandom(max) {
var now = new Date()
var num = now.getTime() * now.getSeconds() * Math.random()
return num % max
}
tb9_startBanner()
// -->
</script>

Yang warna MERAH itu tulisan buat titlebar na. Ganti aja sama yang kamu mau. Klo pengen nambahin tulisan na jadi lebih banyak, tinggal tambah script plus ganti nominal angka na jadi:

• VERSI 1
tb8_messages[3] = "TULISAN";
tb8_messages[4] = "BLAH BLAH";

• VERSI 2
tb9_messages[3] = "TULISAN";
tb9_messages[4] = "BLAH BLAH";

.....dan seterus na...
yang pasti, klo mau nambahin jumlah tulisan, script yang new tb8_makeArray(3) / new tb9_makeArray(3) juga mesti ikut diganti sesuai sama jumlah titlebar. I mean, script standar yang aku kasih kan jumlah titlebar na ada 3, jadi tulisan di new tb8_makeArray(3) / new tb9_makeArray(3) juga TIGA. Klo mau nambahin jadi lima, ya ganti angka na jadi 5.

buat warna BIRU juga bisa diganti:

1. tb8_speed / tb9_speed, kecepatan tulisan. Semakin kecil angka, semakin cepat tulisan berjalan
   
2. tb8_delay / tb9_delay, jarak jeda ketika tulisan berganti. Semakin kecil angka, semakin sebentar jeda

Itu aja sih hal penting yang mesti diganti, yang lain ga usah diubah juga gpp. Aku sendiri ga pake beginian, lebih enak pake titlebar asli aja, lebih simpel.

Comment, minna~