-->

Welkems To PRINCESS OF PIINK blogg :)

Pages

  • Home
  • Tutorial


glitter-graphics.com v

Friday, 6 April 2012

Objek Berpusing Keliling Cursor

kowang ape kabarr ? 
todayy KeyQha nk tunjuk aja kt kowangg camne nk buat ader objek berpusing keliling cursor mcam gambar di bawahh :


sory if gambar tak mengizinkan =(

Kalau nak tegok demo tekan SINI 

 1. Sign In > Dashboard > Design > Add a Gadget > HTML/Java Script 

 2. Copy & Paste kan kod di bawah dekat HTML/Java Script . ( tak faham <<< Klik ? )

  

<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);
} 
else
if (window.attachEvent)
{
window.attachEvent("onload",init);
document.attachEvent("onmousemove",mouse);
window.attachEvent("onresize",winsize);
}
</script>


3. Save & tengok hasilnye =)
Coretan dari Smoochie ᵔᴥᵔ at 23:36
Email ThisBlogThis!Share to XShare to FacebookShare to Pinterest

No comments:

Post a Comment

Assalamualaikum & Hiiii !
Meyhh lha comment snii .
Saie x pakse tauu .
:)

Newer Post Older Post Home
Subscribe to: Post Comments (Atom)

Thank Melawat yerr :)

Backgrounds & Cute Backgrounds
*/
Backgrounds & Pink Backgrounds
Domo-kun Waving His Hands
Kouranng !Jom tengok citerr yg baruu tasya post niyy ! :)
In your HEART =D
http://i1105.photobucket.com/albums/h346/ayusleeping11/sbox/sbox2.png
[close]

Blog akak Comelss !


(: Bacerr tao (:

Awakk ! Come on , klu berminadd BLOG nii ! Tekan " Follow " yg tertera , Tak paksee tao , just sukesuke .. ;)

Blog Archive

  • ▼  2012 (18)
    • ▼  April (8)
      • Saye sayang awk sangat-2 S2
      • Cara Buat Read More ( Cara 1 )
      • Objek Berpusing Keliling Cursor
      • Kelopak Bunga Berguguran di BLOG
      • Icon Cute di Post
      • Cara-2 nak buat PAGE =D
      • Letak lagu dalam blogg :)
      • Cursor yg comel-2
    • ►  March (6)
    • ►  February (1)
    • ►  January (3)
  • ►  2011 (6)
    • ►  November (6)

About Me

Smoochie ᵔᴥᵔ
Selangor, Malaysia
Assalamualikum . Stay in my blog k ;) <3
View my complete profile

Amani

Amani

Singgah Sini Meyhh !

Hiii .. Welcome yepp ! :) Enjoyy okeyy !


Saies with Hajidahh !

Saies with Hajidahh !
Kawan aje kamii nehh , skrg dy fom 1 yg sklh dkt Sk Matang ! :))

Erycha's Total Pageviews

Saia dgn Izz

Saia dgn Izz
Baek sajja ! Hekhek

Eyrza

Eyrza
BFF ♥

Saia dgn Fateen !

Saia dgn Fateen !
Kawan Baek !

Followers

Facebook Badge

Nurul Natasya

Create Your Badge

Bye ! Datang Lagi tauu ! :)

Jangan lupe dtg lagii ! Kedatangan korang di alu alu kann ! :)

My SOngg !


MusicPlaylist
Music Playlist at MixPod.com
Powered by Blogger.