IE11 css анимации с сумасшедшей функцией синхронизации

Question

По какой-то причине все анимации на моем сайте, которые отлично работают на firefox/chrome/edge, имеют некоторые сумасшедшие моменты в IE11.

Анимация, как она предназначена: http://sendvid.com/52jn0saf

анимация на IE11: http://sendvid.com/vt6mk9pm Я попытался изменить анимацию-газораспределительную-функцию, я попытался добавить анимацию задержки 0, но ничего не работает.

анимация прокрутки в:

.step__hidden{ 
    top: -100vh; 
} 

.step__active{ 
    animation: scrollIn 1s ease-in-out 0s; 
    top: 0; 
} 


@keyframes scrollIn{ 
    0%{ 
     transform: translateY(-100vh); 
    } 
    100%{ 
     transform: translateY(0); 
    } 
} 

Кроме того, есть даже способ проверки анимации в IE/резец Дев, как и в других, Санер браузерах?

Answer 1

Это может быть из-за вас хватает на поставщика префикс IE для преобразования:

@keyframes scrollIn{ 
    0%{ 
     -ms-transform: translateY(-100vh); 
     transform: translateY(-100vh); 
    } 
    100%{ 
     -ms-transform: translateY(-100vh); 
     transform: translateY(0); 
    } 
} 

Вы можете установить Firebug на IE, чтобы проверить