JQueryカスタムCircleAnimation、Animateメソッド研究メモ_jquery

JQuery を学習している他の学生に役立つことを願って、学習結果をここに投稿し、また私自身の学習状況を記録します。
いくつかの公式 JQuery チュートリアルを読んだ後、私はすでに少し興奮していたので、自分で何か書いてみることにしました。素晴らしいアニメーション効果をたくさん見たので、自分でも試してみることにしました。js コードを以下に掲載します。

コピーします。 code コードは次のとおりです。

var CircleAnimation = function (center_left, center_top, id, watchwise, period) {
return new CircleAnimation.fn. init(center_left、center_top、id、時計回り、duration);
CircleAnimation.fn = CircleAnimation.prototype = {
item: {},
init:
function (center_left, center_top、id、時計回り、期間) {
this.item = $("#" id "");
if (!this.item[0])
return;
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)
r = Math.pow; .pow(currentPoint .x, 2) Math.pow(currentPoint.y, 2), 0.5);
var flag = false;
var caculateMiniAngle = function (angle) {
//最小値を計算します角度差、2 点間の距離が 1px 未満の場合、この 2 ポニッツの角度が最小角度差であると考えられます
if (Math.sin(angle / 2) * 2 * r > 1) {
return caculateMiniAngle(angle / 2);
else {
return angle;
}
miniAngle = caculateMiniAngle(Math.PI / 4);データを dom 要素に保存します。
this.item.data("currentPoint", currentPoint);
this.item.data("center_top", center_top);
this.item.data("r", r);
this.item.data("時計回り", 時計回り); ;
this.item.data("duration", period);
//this.item.data("startX", this.startX);
start:
function () {
var 要素;
if (this.id)
要素 = $("#" this.id.toString());
else
要素 = 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 angle = Math.PI - angle;
// 現在の点の角度と次の点の角度の間の角度の差を計算します
var anglediff = el.data("miniAngle"); >if (el .data("期間") != 未定義)
anglediff = 2 * Math.PI * 13 / el.data(
"期間");時計回り"))
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 = argument[1]
// 円のアニメーションが停止しないように十分な長さを設定します
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 =