TUTORIAL CARA MEMBUAT FRIENDSTER LAYOUT SENDIRI

Tutorial ini akan membantu kamu bagaimana cara mendesign sendiri layout Friendster kamu. Dengan menggunakan bantuan Friendster layout generator yang akan mempermudah kita untuk melakukan design, layouting, dan langsung mengetahui hasilnya. Apa yang membuat layout generator ini berbeda dengan lainnya? Tentu saja karena disana kita bias melakukan editing layout sedangkan preview hasilnya akan langsung terlihat on the fly. Lalu bagaimana caranya?

Next Information....

ANIMASI CURSOR FRIENDSTER

Pengen tampilan Friendster layout kamu terlihat lebih cantik dan menarik? Selain kamu mengoptimalkan design layout profile friendster kamu dengan menggunakan CSS external file, kamu juga butuh sedikit otak-atik animasi dengan menggunakan Javascript (js extension). Tutorial berikut ini akan memberikan implementasi penggunaan js extension (Java script) pada profile friendstermu agar layout cantikmu itu semakin menarik untuk dilihat.
Untuk itu kita akan gunakan sedikit sentuhan animasi gelembung-gelembung udara yang muncul dari ujung cursor kamu. Cursor adalah penunjuk di monitor yang bergerak-gerak setiap kamu mengarahkan mouse.Untuk langkah awal buka Notepad kamu (atau text editor lain) kemudian copy-paste-kan kode berikut ini dan "Save as" menjadi java script dengan menambahkan akhiran js extension dibelakan file (contoh; gelembung.js). Caranya: File -> Save As(Save as type pilih all files) - Save.
<!--<br /><br />n4=(document.layers);<br<br />/>n6=(document.getElementById&&!document.all);<br<br />/>ie=(document.all);<br<br />/>o6=(navigator.appName.indexOf("Opera") != -1)?true:false;<br<br />/><br />img0=new Image();<br<br />/>img0.src="http://url-ke-gelembung.mu/gelembung.gif";<br<br />/><br />num=(n6)?10:15;<br /><br />y=0;<br<br />/>x=0;<br />if (n4||n6){<br<br />/>window.captureEvents(Event.MOUSEMOVE);<br />function<br />mouse1(e){<br /> y = e.pageY-20-window.pageYOffset;<br /> x<br />= e.pageX-4;<br /> } <br />if (n4)<br />window.onMouseMove=mouse1;<br />else<br />document.onmousemove=mouse1;<br />}<br />if (ie||o6){<br<br />/> function mouse2(){<br /> y =<br />(ie)?event.clientY-20:event.clientY-20-window.pageYOffset;<br /><br />x = event.clientX-4;<br /> } <br<br />/>document.onmousemove=mouse2;<br />}<br />yp=new<br />Array();<br />xp=new Array();<br />sp=new Array();<br<br />/>rt=new Array();<br />gr=new Array();<br />s1=new<br />Array();<br />s2=new Array();<br />nz=new Array();<br<br />/>wh=(ie)?window.document.body.clientHeight:window.innerHeight;<br<br />/>for (i=0; i < num; i++){ <br /><br />yp[i]=Math.random()*wh-y;<br /> xp[i]=x;<br /> sp[i]=<br />6+Math.random()*3;<br /> s1[i]=0;<br /><br />s2[i]=Math.random()*0.1+0.05;<br /> gr[i]=4;<br /><br />nz[i]=Math.random()*15+5;<br /><br />rt[i]=Math.random()*0.5+0.1;<br />}<br />if (n4){<br<br />/> for (i=0; i < num; i++){<br /> document.write("<LAYER<br />NAME='bub"+i+"' LEFT=0 TOP=-50>"<br />+"<img<br />src='http://url-ke-gelembung.mu/gelembung.gif' width="+nz[i]+"<br />height="+nz[i]+"></LAYER>");<br /> }<br />}<br<br />/>if (ie){<br />document.write('<div<br />style="position:absolute;top:0px;left:0px"><div<br />style="position:relative">');<br /> for (i=0; i < num;<br />i++){<br /> document.write('<img id="bub'+i+'"<br />src="'+img0.src+'"<br />style="position:absolute;top:-50px;left:0px">');<br /> }<br<br />/> document.write('</div></div>');<br />}<br<br />/>if (n6||o6){<br /> for (i=0; i < num; i++){<br /><br />document.write("<div id='bub"+i+"'<br />style='position:absolute;top:-50px;left:0px'>"<br />+"<img<br />src="+img0.src+" width="+nz[i]+"<br />height="+nz[i]+"></div>");<br /> }<br />}<br<br />/>function MouseBubbles(){<br<br />/>scy=(document.all)?document.body.scrollTop:window.pageYOffset;<br<br />/>scx=(document.all)?document.body.scrollLeft:window.pageXOffset;<br<br />/>for (i=0; i < num; i++){<br />sy =<br />sp[i]*Math.sin(270*Math.PI/180);<br />sx =<br />sp[i]*Math.cos(s1[i]*5);<br />yp[i]+=sy;<br />xp[i]+=sx;<br /><br />if (yp[i] < -40){<br /> yp[i]=y;<br /><br />xp[i]=x;<br /> sp[i]= 6+Math.random()*3;<br /><br />gr[i]=4;<br /> nz[i]=Math.random()*15+5;<br />}<br<br />/>if (n4){<br /><br />document.layers["bub"+i].left=xp[i]+scx;<br /><br />document.layers["bub"+i].top=yp[i]+scy;<br />}<br />if<br />(ie){<br /><br />document.getElementById("bub"+i).style.left=xp[i]+scx;<br /><br />document.getElementById("bub"+i).style.top=yp[i]+scy;<br /><br />document.getElementById("bub"+i).style.width=gr[i];<br /><br />document.getElementById("bub"+i).style.height=gr[i]; <br<br />/>}<br />if (n6||o6){<br /><br />document.getElementById("bub"+i).style.left=xp[i]+scx;<br /><br />document.getElementById("bub"+i).style.top=yp[i]+scy;<br<br />/>}<br />gr[i]+=rt[i]; <br />s1[i]+=s2[i];<br />if<br />(gr[i] > 14) gr[i]=15;<br />}<br<br />/>setTimeout('MouseBubbles()',10);<br />}<br<br />/>MouseBubbles();<br />//--><br />

Untuk lebih jelasny, baca dulu post ini sampai selesai. Setelah kode di atas kamu save menjadi js extension lalu silahkan kamu upload ke file hosting yang support direct hot link kesayanganmu (bisa Ripway, Dompetfoto, Hotlinkfiles, dll) lalu dapatkan kode url link ke file tersebut (contoh: http://h1.ripway.com/Yeyen/gelembung.js). Nah langkah terakhir kamu tinggal memasukkan url js extension mu tsb ke Friendster menggunakan JS Linker.

Next Information....