Element.Style additions, requires Accessor.js from MooTools 2.0

Element.Style.js

(function(){

var global = this,
	list = ['', 'webkit', 'Moz', 'O', 'ms'],
	prefixList = {},
	setStyle = Element.prototype.setStyle,
	getStyle = Element.prototype.getStyle;

var getPrefix = function(property){
	property = property.camelCase();
	var element = document.html;
	for (var i = 0; i < list.length; i++){
		var prefix = list[i];
		if (element.style[prefix ? prefix + property.capitalize() : property] != null)
			return prefix ? '-' + prefix.toLowerCase() + '-' : prefix.toLowerCase();
	}
	return '';
};

var getVendorPrefix = function(property){
	if (prefixList[property] != null) return prefixList[property];
	return (prefixList[property] = getPrefix(property));
};

var getStyleProperty = function(property){
	if (prefixList[property] != null) return prefixList[property] + property;
	return (prefixList[property] = getPrefix(property)) + property;
};

var transform = getStyleProperty('transform'),
	transformProperty = transform.camelCase().capitalize(),
	has3d = (function(){
		if (!('WebKitCSSMatrix' in global)) return false;

		var element = new Element('div');
		element.style[transform] = 'translate3d(1px, 0, 0)';
		try {
			if (new WebKitCSSMatrix(element.style[transform]).e == 1) return true;
		} catch(e){}
		return false;
	})();

Element.extend(new Accessor('StyleGetter')).extend(new Accessor('StyleSetter')).extend({

	getVendorPrefix: getVendorPrefix,
	getStyleProperty: getStyleProperty


}).implement({

	setStyle: function(property, value){
		property = getStyleProperty(property).camelCase();
		var setter = Element.lookupStyleSetter(property);
		if (setter){
			setter.call(this, value);
			return this;
		}
		return setStyle.call(this, property, value);
	},

	getStyle: function(property){
		property = getStyleProperty(property).camelCase();
		var getter = Element.lookupStyleGetter(property);
		return getter ? getter.call(this, property) : getStyle.call(this, property);
	}

}).defineStyleSetter(transform.camelCase(), function(value){
	if (typeof value != 'string'){
		// Speed! Relies on Array toString
		var style = [],
			translate = value.translate;

		if (value.translateX) style.push('translateX(' + value.translateX + ')');
		if (value.translateY) style.push('translateY(' + value.translateY + ')');
		if (value.translateZ) style.push('translateZ(' + value.translateX + ')');
		if (translate){
			var property = translate;
			if (typeof property == 'string') property = property.split(/\s*,\s*/);
			if (has3d && property.length == 2) property.push(0);
			if (!has3d && property.length == 3) property.pop();
			style.push('translate' + (has3d ? '3d' : '') + '(' + property + ')');
		}

		if (value.rotateX) style.push('rotateX(' + value.rotateX + ')');
		if (value.rotateY) style.push('rotateY(' + value.rotateY + ')');
		if (value.rotateZ) style.push('rotateZ(' + value.rotateX + ')');
		if (value.rotate) style.push('rotate(' + value.rotate + ')');
		if (value.skewX) style.push('skewX(' + value.skewX + ')');
		if (value.skewY) style.push('skewY(' + value.skewY + ')');
		if (value.skew) style.push('skew(' + value.skew + ')');
		if (value.scaleX) style.push('scaleX(' + value.scaleX + ')');
		if (value.scaleY) style.push('scaleY(' + value.scaleY + ')');
		if (value.scale) style.push('scale(' + value.scale + ')');
		if (value.matrix) style.push('matrix(' + value.matrix + ')');
		value = style.join(' ');
	}

	this.style[transformProperty] = value;
});

if (document.html.style.opacity != null) Element.Properties.opacity.set = function(value){
	this.style.opacity = value;
};

}).call(this);

There's only the general CSS value parser. It parsers values with units, function calls (nested too), multiple declarations, strings and keywords into object. There's no parser specific to transformations. That's the beauty of Sheet.js, because there's only two parsers (stylesheet & value).

You can find it here:
https://github.com/Inviz/Sheet.js/blob/properties/Source/SheetParser.Value.js
https://github.com/Inviz/Sheet.js/blob/properties/Test/SheetParser.Value.test.js

Although there is a parser for webkit animation keyframes and that stuff. It's not really maintained anymore (but i soon will have to look into it), but you can find a remaining unit test here: https://github.com/Inviz/Sheet.js/blob/properties/Test/SheetParser.CSS.RegExp.test.js

There's also a full CSS3 property definition library with keywords and all possible values that parses any string value and splits them into properties (so called property expansion). It also invalidates incorrect values.

Useful to handle any values in any forms:
https://github.com/Inviz/Sheet.js/blob/properties/Source/SheetParser.Styles.js
https://github.com/Inviz/Sheet.js/blob/properties/Source/SheetParser.Property.js
https://github.com/Inviz/Sheet.js/blob/properties/Test/SheetParser.Property.test.js

If you think that's something's missing, then i'm open for suggestions

UPDATE: Fixed link

i know what exactly missing, it doesnt convert it to string out of the box. But it's very easy to do if you take closer look at the parsed values

To optimize this a bunch: http://jsfiddle.net/sEVYY/23/

...annnd...BOOM goes the dynamite.

Sheet FTW ^_^
#totallyUnbiasedThirdParty