Question

Is there a way to make a transition in angle starting from the element’s last position during several transitions?

div2 {
  transform: translateX(90px);
  transform: translateY(90px);
  transform: translate(110px,110px);
}

Example

Basically what i would like to do is to make the div move 110px from the top and 110px from the left of the ‘Transition 2’ state.

I am using jQuery.Transit plugin.

Answer 1

You can use jQuery’s built-in incrementation syntax:

//Transition 1
$('#div2').transition({ x: "+=" + 90 });
//Transition 2
$('#div2').transition({ y: "+=" + 90 });
//Transition 3
$('#div2').transition({ x: "+=" + 110, y: "+=" + 110 });