设置移动端transition、translate样式

css3Style.js

// 设置动画、坐标移动样式（硬件加速、浏览器兼容、原生方式）
var CSS_PREFIX_MAP = ["webkit", "moz", "ms", "o", ""],
		NUMBER_REG = /\-?[0-9]+\.?[0-9]*/g;

var setTransition = function(ele, css) {
	var name, prefix, _i, _len, _results;
	_results = [];
	for (_i = 0, _len = CSS_PREFIX_MAP.length; _i < _len; _i++) {
		prefix = CSS_PREFIX_MAP[_i];
		name = prefix ? "" + prefix + "Transition" : "transition";
		_results.push(ele.style[name] = css);
	}
	return _results;
};
var setTranslate = function(ele, x, y, z) {
    var name, prefix, _i, _len, _results;
    _results = [];
    for (_i = 0, _len = CSS_PREFIX_MAP.length; _i < _len; _i++) {
		prefix = CSS_PREFIX_MAP[_i];
		name = prefix ? "" + prefix + "Transform" : "transform";
		_results.push(ele.style[name] = "translate3d(" + (x || 0) + "px, " + (y || 0) + "px, " + (z || 0) + "px)");
	}
	return _results;
};
var getTranslate = function(ele) {
    var coord, css, name, prefix, translate, _i, _len;
    translate = [];
    css = '';
    coord = '';
	for (_i = 0, _len = CSS_PREFIX_MAP.length; _i < _len; _i++) {
		prefix = CSS_PREFIX_MAP[_i];
		name = prefix ? "" + prefix + "Transform" : "transform";
		css = ele.style[name];
		if (css && typeof css === 'string') {
		    coord = css.match(/\((.*)\)/g)[0];
		    translate = coord && coord.match(NUMBER_REG);
		    break;
  		}
	}
	if (translate.length) {
  		return {
		    x: translate[0] || 0,
		    y: translate[1] || 0,
		    z: translate[2] || 0
  		};
	}
};

// 1. 取消动画
setTransition(ele, null); 

// 2. 设置动画
var duration = 200;
setTransition(ele, "all " + duration + "ms ease-in");

// 3. 设置translate3d
setTranslate(ele, 0, 0, 0);

// 4. 获取translate样式
var trans = getTranslate(this.ele);