JQuery custom CircleAnimation, Animate method learning note _ jquery-js tutorial

I recently read some basic JQuery tutorials, which are deeply attracted by JQuery. I have used Extjs before. I can't help but sigh when I read JQuery. It's amazing that javascript can be used! I have posted some learning achievements here, hoping to help others who want to learn JQuery and record their learning status.
After reading some official JQuery tutorials, I was a little overwhelmed and decided to write something on my own. I saw a lot of awesome animation effects and decided to try it myself. I decided to write an animation effect of circular motion. Below I posted the js Code

The Code is as follows:

Var CircleAnimation = function (center_left, center_top, id, clockwise, duration ){
Return new CircleAnimation. fn. init (center_left, center_top, id, clockwise, duration );
};
CircleAnimation. fn = CircleAnimation. prototype = {
Item :{},
Init:
Function (center_left, center_top, id, clockwise, duration ){
This. item = $ ("#" + id + "");
If (! This. item [0])
Return;
CurrentPoint = {
X: this.item.css ("left") = "auto "? 0: String(this.item.css ("left"). replace ("px", "")-center_left,
Y: this.item.css ("top") = "auto "? 0: String(this.item.css ("top"). replace ("px", "")-center_top
};
Center_left = center_left;
Center_top = center_top;
If (currentPoint. x = 0 & currentPoint. y = 0)
Return;
R = Math. pow (Math. pow (currentPoint. x, 2) + Math. pow (currentPoint. y, 2), 0.5 );
Var flag = false;
Var caculateMiniAngle = function (angle ){
// Caculate the minimum angle diff, if the distance between 2 points less than 1px, we think this 2 ponits angle shocould be the minimum angle diff
If (Math. sin (angle/2) * 2 * r> 1 ){
Return caculateMiniAngle (angle/2 );
}
Else {
Return angle;
}
}
MiniAngle = caculateMiniAngle (Math. PI/4 );
// Store data to dom element
This. item. data ("currentPoint", currentPoint );
This. item. data ("center_left", center_left );
This. item. data ("center_top", center_top );
This. item. data ("r", r );
This. item. data ("clockwise", clockwise );
This. item. data ("miniAngle", miniAngle );
This. item. data ("duration", duration );
// This. item. data ("startX", this. startX );
},
Start:
Function (){
Var element;
If (this. id)
Element = $ ("#" + this. id. toString ());
Else
Element = this. item;
Element. animate ({left: 1, top: 1 },{
Duration: element. data (
"Duration "),
Step: CircleAnimation. fn. caculateNextPoint
});
},
CaculateNextPoint:
Function (){
Var el;
El = $ (
"#" + This. id. toString ());
Var sin = el. data ("currentPoint"). y/el. data ("r ");
Var angle = Math. asin (sin );
If (el. data ("currentPoint"). x <0)
Angle = Math. PI-angle;
// Caculate the angle diff between current point angle and next point angle
Var anglediff = el. data ("miniAngle ");
If (el. data ("duration ")! = Undefined)
Anglediff = 2 * Math. PI * 13/el. data (
"Duration ");
If (el. data ("clockwise "))
Angle = angle-anglediff;
Else
Angle = angle + anglediff;
Var y = el. data ("r") * Math. sin (angle );
Var x = el. data ("r") * Math. cos (angle );
Var fx = arguments [1];
// Set duration big enough then circle animation never stop
Fx. options. duration = (
New Date). getTime ()-fx. startTime + 10000;
If (fx. prop = "top ")
Fx. now = y + el. data (
"Center_top ");
If (fx. prop = "left ")
Fx. now = x + el. data (
"Center_left ");
El. data (
"CurrentPoint", {x: x, y: y });
},
Stop:
Function (){
This. item. queue ("fx", []);
This. item. stop ();
}
};
CircleAnimation. fn. init. prototype = CircleAnimation. fn;