CSS3 спиннер не работает на IE 11

Question

, пожалуйста, кто-нибудь может мне помочь. Я не знаю, почему мой загрузчик не работает в IE 11, я дважды проверил в Google и на форумах, но безрезультатно, спасибо заранее за помощь, это мой код CSS:

<style>
#busybox {
}

#busybox div {
    top: calc(50% - 45px);
    left: calc(50% - 45px);
    position: fixed;
    width: 90px;
    height: 90px;
    border-radius: 50%;
    border: 4px solid {{spinnerColor}};
    border-left-color: transparent;
    border-right-color: transparent;
    z-index: 1000;
}

animation: busybox_kf 1s linear 0s infinite normal none running;
}

@keyframes busybox_kf {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@-webkit-keyframes busybox_kf {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
</style>

Answer 1

Используйте -webkit-transform или -ms-transform для различных версий IE.Страница MDN для свойства преобразования упоминает уровень поддержки для различных версий IE.

@keyframes busybox_kf {
    0% { -ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg) } /* same approach for remaining rules below */
    100% { transform: rotate(360deg); }
}

@-webkit-keyframes busybox_kf {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}