我决定要写一个圆周运动的动画效果【澳门金莎网址】

我决定要写一个圆周运动的动画效果【澳门金莎网址】。在此贴出一些学习成果,希望能对学习JQuery的其他同学有所帮助,同时也记录下自己的学习情况。
看了一些JQuery的官方教程,已经有点心潮澎湃了,就决定自己尝试着写一些东西出来。我看到了很多很绚的动画效果,然后决定自己也尝试一下,我决定要写一个圆周运动的动画效果,下面贴出js代码
复制代码 代码如下: 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 = $; if return; currentPoint = { x: this.item.css == “auto”
? 0 : String).replace – center_我决定要写一个圆周运动的动画效果【澳门金莎网址】。left, y: this.item.css == “auto” ? 0 :
String.replace – center_top }; center_澳门金莎网址,left = center_left; center_top
= center_top; if (currentPoint.x == 0 && currentPoint.y == 0) return; r
= Math.pow(Math.pow + Math.pow, 0.5); var flag = false; var
caculateMiniAngle = function { //caculate the minimum angle diff, if the
distance between 2 points less than 1px, we think this 2 ponits angle
should be the minimum angle diff if * 2 * r > 1) { return
caculateMiniAngle; } else { return angle; } } miniAngle =
caculateMiniAngle; //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;
this.item.data(“clockwise”, clockwise); this.item.data(“miniAngle”,
miniAngle); this.item.data; //this.item.data(“startX”, this.startX); },
start: function () { var element; if element = $(“#” +
this.id.toString; else element = this.item; element.animate({ left: 1,
top: 1 }, { duration: element.data, step:
CircleAnimation.fn.caculateNextPoint }); }, caculateNextPoint: function
() { var el; el = $( “#” + this.id.toString; var sin = el.data.y /
el.data; var angle = Math.asin; if (el.data.x < 0) angle = Math.PI –
angle; //caculate the angle diff between current point angle and next
point angle var anglediff = el.data; if != undefined) anglediff = 2 *
Math.PI * 13 / el.data; if angle = angle – anglediff; else angle =
angle + anglediff; var y = el.data * Math.sin; var x = el.data *
Math.cos; var fx = arguments[1]; //set duration big enough then circle
animation never stop fx.options.duration = – fx.startTime + 10000; if
fx.now = y + el.data; if fx.now = x + el.data; el.data( “currentPoint”,
{ x: x, y: y }); }, stop: function () { this.item.queue;
this.item.stop(); } }; CircleAnimation.fn.init.prototype =
CircleAnimation.fn;

相关文章