Question

what is the correct -webkit-transition-property for css transforms and how do i set them with jQuery?

i tried the folliwing code that does not work:

$('#my-object')
    .css('-webkit-transition-property', 'transform')
    .css('-webkit-transform', 'translate3d(0, 0, 0)')

$('#my-object')
    .css('-webkit-transition-property', '-webkit-transform')
    .css('-webkit-transform', 'translate3d(0, 0, 0)')

Answer 1

As far as I remember, jQuery uses the javascript names internally when invoking the css method. Since all Webkit related thing have a ‘webkit’ in front of it, the property you are looking for is called WebkitTransform.
Don’t know if jQuery accepts it, but applying it directly to the domelement.style works!

IMHO -> add everything except the Transform property to a class and add/remove classes instead of inlining the styles.