Cita:
Iniciado por Panino5001 
Tendrías que estudiar acerca de cómo funcionan las matrices de transformación. Un buen link para entenderlo es este: [url]http://www.senocular.com/flash/tutorials/transformmatrix/[/url]
(que no te confunda que hable de flash, es aplicable 100% a canvas y css3).
Una vez comprendido el funcionamiento, podés en cualquier momento obtener los valores de estilos computados para realizar tus cálculos:
Código PHP:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
<style type="text/css">
#mydiv{
width:400px; height:20px; background:#F00;
-moz-transition-property:-moz-transform;
-moz-transition-duration:3s;
-moz-transition-timing-function:ease-out;
}
.mover{-moz-transform:translate(100px,100px);}
</style>
<script type="text/javascript">
function mover(){
document.getElementById('mydiv').className='mover';
control();
}
function control(){
document.getElementById('log').innerHTML=window.getComputedStyle(document.getElementById('mydiv'),null).getPropertyValue('-moz-transform') ;
setTimeout(control,50);
}
</script>
</head>
<body>
<div id="mydiv">Me deslizo suavemente como hoja mecida por el viento</div>
<form id="form1" name="form1" method="post" action="">
<label>
<input type="button" name="button" id="button" value="mover" onclick="mover();" />
</label>
</form>
<div id="log"></div>
</body>
</html>
La función control obtiene -moz-transform , pero .. ¿donde los escribe? , lo siento si parece na pregunta ovbia pero soy un poco lento en esto de los script :(