TUTORIAL : Moving word on your CURSOR..

www.tips-fb.com Views
Assalamualaikum ..
Haa .. jom masuk kelas tutorial .. cepatt !!
Oke .. hari ni Sarah nak ajar korg camne nak wat moving word kat cursor korg ..
Err .. cursor tu ape je Sarah ?? cursor uh sejenis kuih!hee ... tuuu .. MOUSE korg uh! Tu la cursor syggg !hee..
Haa .. skung da tau ape itu cursor? lau tau, jom kite wat!
1st ambek gandum,telur,butter bla bla blaa ...haha ..follow je this step oke!

1. DASHBOARD > DESIGN > ADD GADGET > Html/JavaScript 
2. COPY and PASTE code kat bawah ni ye anak2 sekalian ..Ehee..

<style type="text/css">
/* Circle Text Styles */
#outerCircleText {
font-style: normal;
font-weight: normal;
font-family: 'comic sans';
color: #FF0080;
position: absolute;top: 0;left: 0;z-index: 3000;cursor: default;}
#outerCircleText div {position: relative;}
#outerCircleText div div {position: absolute;top: 0;left: 0;text-align: center;}
</style>
<script type="text/javascript">
;(function(){
var msg = "TAROK AYAT KORG KAT SINI YE!";
var size = 24;
var circleY = 0.75; var circleX = 2;
var letter_spacing = 5;
var diameter = 10;
var rotation = 0.4;
var speed = 0.2;
if (!window.addEventListener && !window.attachEvent || !document.createElement) return;
msg = msg.split('');
var n = msg.length - 1, a = Math.round(size * diameter * 0.208333), currStep = 20,
ymouse = a * circleY + 20, xmouse = a * circleX + 20, y = [], x = [], Y = [], X = [],
o = document.createElement('div'), oi = document.createElement('div'),
b = document.compatMode && document.compatMode != "BackCompat"? document.documentElement : document.body,
mouse = function(e){
e = e || window.event;
ymouse = !isNaN(e.pageY)? e.pageY : e.clientY; // y-position
xmouse = !isNaN(e.pageX)? e.pageX : e.clientX; // x-position
},
makecircle = function(){ // rotation/positioning
if(init.nopy){
o.style.top = (b || document.body).scrollTop + 'px';
o.style.left = (b || document.body).scrollLeft + 'px';
};
currStep -= rotation;
for (var d, i = n; i > -1; --i){ // makes the circle
d = document.getElementById('iemsg' + i).style;
d.top = Math.round(y[i] + a * Math.sin((currStep + i) / letter_spacing) * circleY - 15) + 'px';
d.left = Math.round(x[i] + a * Math.cos((currStep + i) / letter_spacing) * circleX) + 'px';
};
},
drag = function(){ // makes the resistance
y[0] = Y[0] += (ymouse - Y[0]) * speed;
x[0] = X[0] += (xmouse - 20 - X[0]) * speed;
for (var i = n; i > 0; --i){
y[i] = Y[i] += (y[i-1] - Y[i]) * speed;
x[i] = X[i] += (x[i-1] - X[i]) * speed;
};
makecircle();
},
init = function(){ // appends message divs, & sets initial values for positioning arrays
if(!isNaN(window.pageYOffset)){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
} else init.nopy = true;
for (var d, i = n; i > -1; --i){
d = document.createElement('div'); d.id = 'iemsg' + i;
d.style.height = d.style.width = a + 'px';
d.appendChild(document.createTextNode(msg[i]));
oi.appendChild(d); y[i] = x[i] = Y[i] = X[i] = 0;
};
o.appendChild(oi); document.body.appendChild(o);
setInterval(drag, 25);
},
ascroll = function(){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
window.removeEventListener('scroll', ascroll, false);
};
o.id = 'outerCircleText'; o.style.fontSize = size + 'px';
if (window.addEventListener){
window.addEventListener('load', init, false);
document.addEventListener('mouseover', mouse, false);
document.addEventListener('mousemove', mouse, false);
if (/Apple/.test(navigator.vendor))
window.addEventListener('scroll', ascroll, false);
}
else if (window.attachEvent){
window.attachEvent('onload', init);
document.attachEvent('onmousemove', mouse);
};
})();
</script>

Udah selesai COPY and PATSE ?? opss! sat no jgn SAVE lagi.. jgn le gelojoh sngt!haha..tau la excited sngat an??ngee.. korg ade nampak tak perkataan yg berwarna MERAH kat atas uh ?? haa..yang uh, korg tulis la ayat korg sendirik!
Lantak korg la nak tarok nama ke hape ..janji korg suke .. oke ??

3. Then, baru la boley SAVE yunk oii .. tgk la hasil kerja korg !

Dah coba ? so, jangan lupa bagi credit yep ! muahaha ..



Do you like this? Apa lagi , sila la LIKE (‾⌣‾)♉

Sarah suka orang yang rajin membaca nih!Nak2 lau suka bg comment.. ;)

2 comments :

Anonymous said...

dah jadi terima kasih letak tutorial mcm ni :)

Sarah Muhaimi said...

@hanisah bupel same2 kasih . just share ape yang tahu . sarah pun tgk tutorial dr blog lain jugak . ;D

Post a Comment

  • Home
  • Login
  • my FB!
  • Comel
  • Tutorial
  • About Me!