缓冲运动函数封装

闲来没事就封装一个关于缓冲运动的函数，与其说这是一个缓冲运动函数，不如称这个东西是一个简易的动画库。使用方法也很简单，调用方法传入需要运动的对象、变化的属性集和对应的目标值、变化速率（可选）、方法回调（可选）。支持多个属性同时变化，还可以连续回调，屡试不爽！因为是手写难免会有BUG，后面会持续更新。

版本一：单物体多参数运动，带回调，带速度

function cacheMove (ele, obj, callback, duration) {
	clearInterval(ele.timer);
	ele.timer = undefined;
	var d = duration || 15;
	ele.timer = setInterval(function () {
		for (var props in obj) {
			var s = (obj[props] - getStyle(ele, props)) / d;
			if (props === 'opacity') {
				var speed = s.toFixed(2) * 1;
				ele.style['filter'] = 'alpha(opacity:' + getStyle(ele, props) + speed + ')';
				ele.style['opacity'] = (getStyle(ele, props) + speed) / 100;
			} else {
				var speed = s > 0 ? Math.ceil(s) : Math.floor(s);
				ele.style[props] = getStyle(ele, props) + speed + 'px';
			}
			if (parseFloat(ele.style[props]).toFixed(1) * 1 === (props === 'opacity' ? obj[props] / 100 : obj[props])) {
				clearInterval(ele.timer);
				ele.timer = undefined;
				if (callback && Object.prototype.toString.call(callback) === '[object Function]') callback();
			}
		}
	}, 1000 / 60)
}

function getStyle (ele, attr) {
	if (ele.currentStyle) {
		if (attr === 'opacity') {
			return parseFloat(ele.currentStyle[attr]) * 100;
		} else {
			return parseInt(ele.currentStyle[attr]);
		}
	} else {
		if (attr === 'opacity') {
			return parseFloat(getComputedStyle(ele, null)[attr]) * 100;
		} else {
			return parseInt(getComputedStyle(ele, null)[attr]);
		}
	}
}

版本二：单物体多参数运动，带回调

function startMove(obj, json, fnEnd) {
	clearInterval(obj.timer);
	obj.timer = setInterval(function () {
		var bStop = true;
		for (var attr in json) {
			var cur = 0;
			if (attr === 'opacity') {
				cur = Math.round(parseFloat(getStyle(obj, attr)) * 100);
			} else {
				cur = parseInt(getStyle(obj, attr));
			}
			var speed = (json[attr] - cur) / 6;
			speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed);
			if (cur !== json[attr]) bStop = false;
			if (attr === 'opacity') {
				obj.style.filter = 'alpha(opacity:' + (cur + speed) + ')';
				obj.style.opacity = (cur + speed) / 100;
			} else {
				obj.style[attr] = cur + speed + 'px';
			}
		}
		if (bStop) {
			clearInterval(obj.timer);
			if (fnEnd) fnEnd();
		}
	}, 30)
}

function getStyle (obj, name) {
	if (obj.currentStyle) {
		return obj.currentStyle[name];
	} else {
		return getComputedStyle(obj, false)[name];
	}
}

版本三：单物体单参数运动

function startMove(obj, attr, iTarget) {
	clearInterval(obj.timer);
	obj.timer = setInterval(function () {
		var cur = 0;
		if (attr === 'opacity') {
			cur = Math.round(parseFloat(getStyle(obj, attr)) * 100);
		} else {
			cur = parseInt(getStyle(obj, attr));
		}
		var speed = (iTarget - cur) / 6;
		speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed);
		if (cur === iTarget) {
			clearInterval(obj.timer);
		} else {
			if (attr === 'opacity') {
				obj.style.filter = 'alpha(opacity:' + (cur + speed) + ')';
				obj.style.opacity = (cur + speed) / 100;
			} else {
				obj.style[attr] = cur + speed + 'px';
			}
		}
	}, 30)
}

function getStyle (obj, name) {
	if (obj.currentStyle) {
		return obj.currentStyle[name];
	} else {
		return getComputedStyle(obj, false)[name];
	}
}