Detect with JavaScript or jQuery if CSS transform 2D is available

Question

I'm displaying a element on my site which I rotate with -90deg but if a browser doesn't support the CSS transform the element looks misspositioned and not really good. Now I want to detect with JavaScript or jQuery (it's indifferent if jQ or JS because I use/loaded already jQ on my site) if this rotation via CSS is supported?

I know Modernizr but just for that little thing I don't want to include that whole library (and speed down the website speed load).

Answer 1

Here's a function based on Liam's answer. It will return either the name of the first supported prefix or false if none of the prefixes are supported.

function getSupportedTransform() {
    var prefixes = 'transform WebkitTransform MozTransform OTransform msTransform'.split(' ');
    var div = document.createElement('div');
    for(var i = 0; i < prefixes.length; i++) {
        if(div && div.style[prefixes[i]] !== undefined) {
            return prefixes[i];
        }
    }
    return false;
}