gsap и css переход в одно и то же время возможно?

Question

Как я могу использовать анимацию GSA TweenMax yoyo на элементе dom, который также имеет свойство перехода css? по умолчанию элемент выполняет анимацию один раз (ff, chrome - not ie), но не раз в качестве yoyo? Есть ли обходной путь, за исключением отказа от перехода css?

HTML: 
<ol > 
     <li class="withcsstransition">with css transition</li> 
     <li >without css transition </li> 
</ol> 

CSS: 
.withcsstransition { 
    transition: all 0.8s ease; 
} 
.active { 
    background: #AAAAAA; 
} 

JS: 
TweenMax.fromTo('li', 0.3, { 
    className: "-=active" 
}, { 
    className: "+=active", 
    yoyo: true, 
    repeat: -1, 
}); 

codepen example

Answer 1

all Заменить в вашей собственности transition CSS специально предназначаться свойство т.е. min-height. Так transition строка вашего CSS должен выглядеть следующим образом:

... 
transition: min-height 0.8s ease; 
... 

Я не в полной мере понять, почему за ним. Мне кажется, что как-то transition ключевое слово свойства all переопределяет и имеет приоритет над любым свойством CSS, которое впоследствии применяется к любому элементу.