CSSのtransform、translateを取得するには?
cssのtransformプロパティについて質問があります。
transformプロパティに、translate(xpx, ypx)を指定した場合のデータを取得するには、どのようにしたらよいでしょうか?
この時、文字列以外の形式で取得したいです。
ウェブブラウザ:Google Chrome バージョン 45.0.2454.101 m
・試したこと
1.jqueryでcssを適用した場合
$(element).css('transform', 'translate(xpx, ypx)');
もしくは
$(element).css('-webkit-transform', 'translate(xpx, ypx)');
と指定すると、
$(element)[0].style.transform
$(element)[0].style.webkitTransform
で値が文字列で取得できる。
$(element).css('transform')
$(element).css('-webkit-transform')
ではnoneが返ってくる。
2.cssを直接指定
cssで直接指定し、上記のプロパティで取得しようとしても
$(element)[0].style.transform
$(element)[0].style.webkitTransform
では空文字が返ってくる。
$(element).css('transform')
$(element).css('-webkit-transform')
ではnoneが返ってくる。
なお、firefox(41.0.1)では
jqueryでcss適用しても、css直接指定しても、
$(element).css('transform')
でmatrixとしてデータが返ってくるのは確認済みです。
jsfiddleのソースを張っておきますのでご確認ください。
jqueryで指定
https://jsfiddle.net/6sqz31qw/1/