JQuery common CSS selector

Edit as of your comment below saying this didn't work for you with your version of jQuery and Chrome.

You could always fall back to the style property on the element:

var abc = $(".abc")[0];
var transform = abc.style.transform || abc.style.webkitTransform;

Live Example

For me, with my version of Chrome on 64-bit Linux, abc.style.transform returns undefined (which makes sense, I only set the vendor-prefixed version) and abc.style.webkitTransform returns the style information. So the above would return the first that wasn't undefined.

$(".abc").css("transform") should return it to you, jQuery normalizes vendor prefixes.

Here's a live example using this div:

<div class="abc" style="-webkit-transform: translate(100px) rotate(20deg); -webkit-transform-origin: 60% 100%;">foo</div>

And this code:

jQuery(function($) {
  display("$('.abc').css('transform') = " + $(".abc").css("transform"));
  display("$('.abc').css('-webkit-transform') = " + $(".abc").css("-webkit-transform"));

  function display(msg) {
    var p = document.createElement('p');
    p.innerHTML = String(msg);
    document.body.appendChild(p);
  }
});

Which outputs (on Chrome):

$('.abc').css('transform') = matrix(0.9396926207859084, 0.3420201433256687, -0.3420201433256687, 0.9396926207859084, 100, 0)

$('.abc').css('-webkit-transform') = matrix(0.9396926207859084, 0.3420201433256687, -0.3420201433256687, 0.9396926207859084, 100, 0)

Note that I only have the prefixed version on the div, but css gives me the same information for both transform and -webkit-transform.

If you want a specific vendor prefix, just be explicit:

$(".abc").css('-webkit-transform');

In most cases, unless you have specifically added different functionality for specific vendors, the generic css property should give you the value you need.

jQuery deals with vendor prefixed properties when you do $('.abc').css('transform').

From the source code:

    cssPrefixes = [ "Webkit", "O", "Moz", "ms" ];

// return a css property mapped to a potentially vendor prefixed property
function vendorPropName( style, name ) {

    // shortcut for names that are not vendor prefixed
    if ( name in style ) {
        return name;
    }

    // check for vendor prefixed names
    var capName = name.charAt(0).toUpperCase() + name.slice(1),
        origName = name,
        i = cssPrefixes.length;

    while ( i-- ) {
        name = cssPrefixes[ i ] + capName;
        if ( name in style ) {
            return name;
        }
    }

    return origName;
}