/**
* Created by EX-MAORUIBIN on 2016-01-15.
* version: 1.0,
* function:Custom implementation animation。
*/
define((function (window) {
var moveStart = function () {
var icur = 0,
speed = 0,
target = 0,
obj = arguments[0] || {},
attr = arguments[1] || undefined,
fn = undefined;
clearInterval(obj.timer);
if (typeof attr === 'object') {
if (arguments[2]) {
if (typeof arguments[2] === 'string') {
var rapid = arguments[2];
switch (rapid) {
case 'normal' :
rapid = 30;
break;
case 'fast' :
rapid = 10;
break;
case 'faster':
rapid = 8;
break;
case 'slow' :
rapid = 50;
break;
case 'slower':
rapid = 80;
break;
default :
rapid = 30;
}
} else if (typeof arguments[2] === 'function') {
fn = arguments[2];
} else {
console.log('参数错误');
}
}
rapid = rapid || 30;
if (arguments[3]) {
fn = arguments[3];
}
obj.timer = setInterval(function () {
for (var prop in attr) {
target = parseFloat(attr[prop]);
if (prop === 'opacity') {
icur = Number((parseFloat(getStyle(obj, prop))).toFixed(2));
} else {
icur = parseInt(getStyle(obj, prop));
}
if (target != icur) {
flag = false;
}
if (prop === 'opacity') {
speed = (target - icur) * 10;
speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed);
speed /= 100;
obj.style.filter = 'alpha(opacity:' + (icur + speed)*100 + ')';
obj.style.opacity = (icur + speed);
} else {
speed = (target - icur) / 10;
speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed);
obj.style[prop] = icur + speed + 'px';
}
}
if (flag) {
clearInterval(obj.timer);
}
}, rapid)
} else {
var iTarget = arguments[2] || undefined;
if (arguments[3]) {
if (typeof arguments[3] === 'string') {
var rapid = arguments[3];
switch (rapid) {
case 'normal' :
rapid = 30;
break;
case 'fast' :
rapid = 10;
break;
case 'faster':
rapid = 8;
break;
case 'slow' :
rapid = 50;
break;
case 'slower':
rapid = 80;
break;
default :
rapid = 30;
}
} else if (typeof arguments[3] === 'function') {
fn = arguments[3];
} else {
console.log('参数错误');
}
}
rapid = rapid || 30;
if (arguments[4]) {
fn = arguments[4];
}
obj.timer = setInterval(function () {
if (attr === 'opacity') {
icur = Math.round(parseFloat(getStyle(obj, attr) * 100));
} else {
icur = parseInt(getStyle(obj, attr));
}
speed = (iTarget - icur) / 10;
speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed);
if (iTarget == icur) {
//TODO:Remember:Must first clean up and then call it.Otherwise,Cleaning up in the first place the callback will also be cleared up.
clearInterval(obj.timer);
if (fn) {
fn();
}
} else {
if (attr === 'opacity') {
obj.style.filter = 'alpha(opacity:' + (icur + speed) + ')';
obj.style.opacity = (icur + speed) / 100;
} else {
obj.style[attr] = icur + speed + 'px';
}
}
}, rapid);
}
}
function getStyle(obj, attr) {
if (window.getComputedStyle) {
return getComputedStyle(obj)[attr];
} else {
return obj.currenStyle(attr);
}
}
window.moveStart = moveStart;
//define( "perfect3", [], function () { return moveStart; } );
})(window));
这个小框架并不好,其实应该使用门面的,只是那个时候没有想那么多,写完了发现没啥用,也就没有改。不足之处大家见谅!
点击查看更多内容
7人点赞
评论
共同学习,写下你的评论
评论加载中...
作者其他优质文章
正在加载中
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦