CSS
.square {
background-color: green;
height: 40px;
width: 40px;
}JS
var square =
{
sizeReal : { "width": 40, "height": 40 }
, position : { "x": 100, "y": 100 }
};
$(".square")[0].style.transform = 'translate(' + square.position.x + 'px,' + square.position.y + 'px)';
The code above modifies the CSS of a square element by moving it using transform property. To achieve the same effect but with different approach involving matrix multiplication, Sylvester library is utilized in the provided example fiddle for clarification.
Your goal is to make the red rectangle behave like the green one. Review your matrices and ensure correct operations are being performed.