Objek Mengikut Cursor


assalammualaikum :)

ha...taw tak apa yang dimaksudkan dengan tajuk entry ieyda kali ni? hehe..selalu kan kebiasaannya ada tutorial yang macam ni jugak..contoh macam yang ada kat cursor ieyda sekarang, bubbles..ada juga yang lain macam sparkling, following star..ikut kekreatifan blog masing-masing..hehe..okay sekarang pulak ieyda nak ajar cara macam mana nak buat cursor yang ada objek yang mengikutnya..nak taw macam mana? jom ;) 

ha ni la yang ida cakap tu..smart tak? ^^
Jom mulakan :

1. Sign in --> Dashboard --> Design/Layout --> Add a Gadget --> Add HTML/Javascript

2. Copy dan paste code kat bawah ni di dalam ruangan HTML/Javascript yang korang klik tadi.


<script language="JavaScript" type="text/javascript">
var xCol = "#FF0000";var yCol = "#FFFF00";var zCol = "#0000FF";
var n = 6; //number of dots per trail.var t = 40; //setTimeout speed.var s = 0.2; //effect speed.
var r,h,w;var d = document;var my = 10;var mx = 10;var stp = 0;var evn = 360/3;var vx = new Array();var vy = new Array();var vz = new Array();var dy = new Array();var dx = new Array();
var pix = "px";
var strictmod = ((document.compatMode) &&document.compatMode.indexOf("CSS") != -1);
var domWw = (typeof window.innerWidth == "number");var domSy = (typeof window.pageYOffset == "number");var idx = d.getElementsByTagName('div').length;
for (i = 0; i < n; i++){var dims = (i+1)/2;d.write('<div id="x'+(idx+i)+'" style="position:absolute;'+'top:0px;left:0px;width:'+dims+'px;height:'+dims+'px;'+'background-color:'+xCol+';font-size:'+dims+'px"><\/div>'+'<div id="y'+(idx+i)+'" style="position:absolute;top:0px;'+'left:0px;width:'+dims+'px;height:'+dims+'px;'+'background-color:'+yCol+';font-size:'+dims+'px"><\/div>'+'<div id="z'+(idx+i)+'" style="position:absolute;top:0px;'+'left:0px;width:'+dims+'px;height:'+dims+'px;'+'background-color:'+zCol+';font-size:'+dims+'px"><\/div>');}
if (domWw) r = window;else{if (d.documentElement &&typeof d.documentElement.clientWidth == "number" &&d.documentElement.clientWidth != 0)r = d.documentElement;else{if (d.body && typeof d.body.clientWidth == "number")r = d.body;}}
function winsize(){var oh,sy,ow,sx,rh,rw;if (domWw){if (d.documentElement && d.defaultView &&typeof d.defaultView.scrollMaxY == "number"){oh = d.documentElement.offsetHeight;sy = d.defaultView.scrollMaxY;ow = d.documentElement.offsetWidth;sx = d.defaultView.scrollMaxX;rh = oh-sy;rw = ow-sx;}else{rh = r.innerHeight;rw = r.innerWidth;}h = rh;w = rw;}else{h = r.clientHeight;w = r.clientWidth;}}
function scrl(yx){var y,x;if (domSy){y = r.pageYOffset;x = r.pageXOffset;}else{y = r.scrollTop;x = r.scrollLeft;}return (yx == 0)?y:x;}
function mouse(e){var msy = (domSy)?window.pageYOffset:0;if (!e) e = window.event; if (typeof e.pageY == 'number'){my = e.pageY - msy + 16;mx = e.pageX + 6;}else{my = e.clientY - msy + 16;mx = e.clientX + 6;}if (my > h-65) my = h-65;if (mx > w-50) mx = w-50;}
function assgn(){for (j = 0; j < 3; j++){dy[j] = my + 50 * Math.cos(stp+j*evn*Math.PI/180) *
Math.sin((stp+j*25)/2) + scrl(0) + pix;dx[j] = mx + 50 * Math.sin(stp+j*evn*Math.PI/180) *
Math.sin((stp+j*25)/2) * Math.sin(stp/4) + pix;}stp+=s;
for (i = 0; i < n; i++){if (i < n-1){vx[i].top = vx[i+1].top; vx[i].left = vx[i+1].left;vy[i].top = vy[i+1].top; vy[i].left = vy[i+1].left;vz[i].top = vz[i+1].top; vz[i].left = vz[i+1].left;}else{vx[i].top = dy[0]; vx[i].left = dx[0];vy[i].top = dy[1]; vy[i].left = dx[1];vz[i].top = dy[2]; vz[i].left = dx[2];}}setTimeout(assgn,t);}
function init(){for (i = 0; i < n; i++){vx[i] = document.getElementById("x"+(idx+i)).style;vy[i] = document.getElementById("y"+(idx+i)).style;vz[i] = document.getElementById("z"+(idx+i)).style;}winsize();assgn();}
if (window.addEventListener){window.addEventListener("resize",winsize,false);window.addEventListener("load",init,false);document.addEventListener("mousemove",mouse,false);} elseif (window.attachEvent){window.attachEvent("onload",init);document.attachEvent("onmousemove",mouse);window.attachEvent("onresize",winsize);}</script>

Yang ieyda highlightkan tu korang boleh tukar warnanya mengikut warna yang korang minat..tak taw mana nak cari? kat SINI la ;)

3. Amacam kawan-kawan? Dah siap paste dah? Tukar warna dah? Tunggu apa lagi..SAVE la..you are DONE! :)

#peringatan untuk korang, jangan lupa padam yang korang dah wat sebelum ni okay..maksud ieyda mungkin ada yang dah buat bubbles,sparkles, dan sebagainya sebelum ni..remove taw,nanti tak jadi pulak..


clobber : to hit someone very hard
sincerely Y

No comments: