Получить процентное значение анимации

Question

Допустим, у меня есть следующее:

CSS

.animatedItem {
    background-color: red;
    width: 200px;
    height: 200px;
    transition: all 1200ms cubic-bezier(0.39, 0.575, 0.565, 1);
}
.animatedItemSate1 {
    margin-left: 0px;
}
.animatedItemState2 {
    margin-left: 200px;
}

JQuery

$('.animatedItem.animatedItemSate1')
     .removeClass('animatedItemSate1')
     .addClass('animatedItemState2');

// get X percent of animation
var percent = 30; // 30% of animation
var animationValue = '?'; // animation value at 30%
alert(animationValue);

HTML

<div class="animatedItem animatedItemSate1"><div>

$('.animatedItem.animatedItemSate1')
  .removeClass('animatedItemSate1')
  .addClass('animatedItemState2');

// get X percent of animation
var percent = 30; // 30% of animation
var animationValue = '?'; // animation value at 30%
console.log(animationValue);

.animatedItem {
  background-color: red;
  width: 200px;
  height: 200px;
  transition: all 1200ms cubic-bezier(0.39, 0.575, 0.565, 1);
}

.animatedItemSate1 {
  margin-left: 0px;
}

.animatedItemState2 {
  margin-left: 200px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="animatedItem animatedItemSate1">
  <div>

Он запускает нелинейную анимацию CSS3. Мне нужно получить значение анимации 30%(или любой другой) до запуска анимации. Как это получить? Я создал скрипку: https://jsfiddle.net/syom777/xnpfzyoL/8/

Обновление: здесь есть похожая дискуссия: CSS3 анимация обратного вызова "progress"

Я думаю, что мы можем применить другой способ получить его, потому что в строке cubic-bezier(0.39, 0.575, 0.565, 1) у нас есть алгоритм анимации, поэтому должен быть способ получить любое значение оттуда.

Благодарю.