Cara Membuat Cursor Diikuti Tulisan

TNCMedia

"Bos minta tutor mouse seperti boss...." sobat yang mengidentitaskan dirinya sebagai dark menulis di Cbox Oce Satria (Eh, emang gw boss apaan?). Maksud si dark tentu cursor di blog ini yang selalu diintilin oleh tulisan "WELCOME TO SembarangKlik!"

Oke, biar nggak batea-tea (itu bahasa oranag padangpanjang, artinya bertele-tele) kita langsung ke TKP aja ya!

1. Masuk ke Dashboard dengan Login ke blogger: www.blogger.com
2. Klik Rancangan dan pada Elemen Halaman klik tambah Gadget
3. Klik HTML/JavaScript
4. Copy dan paste kode java script dibawah ini dan masukan ke dalam kotak HTML/javascript tadi. Udah segitu aja.

// ENTER TEXT BELOW. CAN *NOT* INCLUDE NORMAL HTML CODE. 
var text='CANTUMKAN TULISAN DI SINI, TERSERAH MAU NAMA, KATA-KATA MUTIARA, ATAU MISALNYA 'I LOVE YOU'';

var delay=40; // SPEED OF TRAIL 
var Xoff=0; // PIXEL COUNT FROM THE LEFT OF THE CURSOR (- VALUES GO TO LEFT) 
var Yoff=-30; // PIXEL COUNT FROM THE TOP OF THE CURSOR (- VALUES GO UP) 
var txtw=14; // AMOUNT OF PIXEL SPACE EACH CHARACTER OCCUPIES 
var beghtml=''; // OPTIONAL HTML CODE THAT EFFECTS WHOLE TEXT STRING SUCH AS FONT COLOR, SIZE, ETC. 
var endhtml=''; // END HTML CODE. MOSTLY USED IF ABOVE SETTING IS USED.

ns4 = (navigator.appName.indexOf("Netscape")>=0 && document.layers)? true : false; 
ie4 = (document.all && !document.getElementById)? true : false; 
ie5 = (document.all && document.getElementById)? true : false; 
ns6 = (document.getElementById && navigator.appName.indexOf("Netscape")>=0 )? true: false; 
var txtA=new Array(); 
text=text.split(''); 
var x1=0; 
var y1=-1000; 
var t='';

for(i=1;i<=text.length;i++){ 
t+=(ns4)? '<layer left="0" top="-100" width="'+txtw+'" name="txt'+i+'" height="1">' : '<div id="txt'+i+'" style="position:absolute; top:-100px; left:0px; height:1px; width:'+txtw+'; visibility:visible;">'; 
t+=beghtml+text[i-1]+endhtml; 
t+=(ns4)? '</layer>' : '</div>'; 
} 
document.write(t); 
function moveid(id,x,y){ 
if(ns4)id.moveTo(x,y); 
else{ 
id.style.left=x+'px'; 
id.style.top=y+'px'; 
}}

function animate(evt){ 
x1=Xoff+((ie4||ie5)?event.clientX+document.body.scrollLeft:evt.pageX); 
y1=Yoff+((ie4||ie5)?event.clientY+document.body.scrollTop:evt.pageY); 
}

function getidleft(id){ 
if(ns4)return id.left; 
else return parseInt(id.style.left); 
}

function getidtop(id){ 
if(ns4)return id.top; 
else return parseInt(id.style.top); 
}

function getwindowwidth(){ 
if(ie4||ie5)return document.body.clientWidth+document.body.scrollLeft; 
else return window.innerWidth+pageXOffset; 
}

window.onload=function(){ 
for(i=1;i<=text.length;i++)txtA[i]=(ns4)?document.layers['txt'+i]:(ie4)?d ocument.all['txt'+i]:document.getElementById('txt'+i); 
if(ns4)document.captureEvents(Event.MOUSEMOVE); 
document.onmousemove=animate; 
setInterval('movetxts()',delay); 
} 
</script>

Catatan: sayangnya kode ini hanya bisa jalan pada template tertentu saja. Bagi yang mau silakan coba, mana tau bisa

Happy blogging Sobat!

Tutorial

Silakan Berkomentar di Sini:

KoreanAddict12 Februari 2011 pukul 18.48
gag bisa mas??
gimana c?? ~.~
BalasHapus
Balasan
TNCMedia14 Februari 2011 pukul 00.40
cursor diikuti tulisan seperti punya saya ini saya temukan di sebuah blog dari luar negeri (lupa alamat blognya, kalau nggak salah dari israel) , trus saya cari kode apa yang dipakai dengan cara klik kanan. Lantas saya coba terapkan di blog ini, eh kebenaran bisa. Tapi saya coba di blog dengan template bawaan blogger kok nggak bisa? Kesimpulan: kode ini jalan pada template tertentu saja....
BalasHapus
Balasan
andre29 Maret 2011 pukul 08.45
@KoreanAddictkok dak bisa mas
BalasHapus
Balasan
TNCMedia10 April 2011 pukul 20.57
@andre

Kalau memang tidak jalan, maka jalan satu2nya GANTI template. coba pilih template di sini http://btemplates.com/blogger-templates/web-20/page/2/
BalasHapus
Balasan
Hehe4 Mei 2011 pukul 21.39
kok gk bisa keluar sich tulisanya???
BalasHapus
Balasan
BLUE BLOOD9 Mei 2011 pukul 15.17
sammma ...ga bs juga hehehe
BalasHapus
Balasan
Visi2 Juni 2011 pukul 21.01
kurang detail uy....tak bisa dipahami
BalasHapus
Balasan
Ekasatria Taroesmantini18 Juni 2011 pukul 19.51
kopi kode di atas pastekan pada gadget di bagian HTML/JavaScript . Simpel...
BalasHapus
Balasan
Tiket Pesawat Online10 Oktober 2012 pukul 11.20
tarimo kasih bang oce tip& trik nya , awak sadang oatk-atik blog
BalasHapus
Balasan

Tokoh-Tokoh Penting Upin dan Ipin

11 Garuda dan 80 ribu Pasukan Garuda Kepung Philipina

BOS Tidak Dikenal

Orang Minang Terkemuka di Pentas Sejarah

Siapa Inyiak Sibunian dan Hantu Gunung?

Mahasiswi Ini Mau Difoto Tanpa Busana Demi Uang

Cara Membuat Cursor Diikuti Tulisan

Berapa Gaji Tukang Parkir Pesawat

Kronologi Merger Bank Century

Cara Membuat Cursor Diikuti Tulisan

9 Komentar

Tempat Tepat Penggunaan Lambang Negara Garuda Pancasila

Cerita Lilid: Dimanja Tuhan, Dimanja Teman