How to modify this animation code to make it compatible with ie browsers?

imitates an animation case, but in ie, the circle cannot be turned. If you want to know how to modify it to make it animated, just be compatible with ie10 or above.
/* css */
    -sharploading {
        background-color: rgba( 230, 230, 250, 0.2);
        height: 100%;
        width: 100%;
        position: fixed;
        z-index: 1;
        margin-top: 0px;
        top: 0px;
    }
    -sharploading-center {
        width: 100%;
        height: 100%;
        position: relative;
    }
    -sharploading-center-absolute {
        position: absolute;
        left: 50%;
        top: 50%;
        height: 60px;
        width: 60px;
        margin-top: -30px;
        margin-left: -30px;
        -webkit-animation: loading-center-absolute 1s infinite;
        animation: loading-center-absolute 1s infinite;
    }
    .object {
        width: 20px;
        height: 20px;
        background-color: -sharp7BCECC;
        float: left;
        -moz-border-radius: 50% 50% 50% 50%;
        -webkit-border-radius: 50% 50% 50% 50%;
        border-radius: 50% 50% 50% 50%;
        margin-right: 20px;
        margin-bottom: 20px;
    }
    .object:nth-child(2n+0) {
        margin-right: 0px;
    }
    -sharpobject_one {
        -webkit-animation: object_one 1s infinite;
        animation: object_one 1s infinite;
    }
    -sharpobject_two {
        -webkit-animation: object_two 1s infinite;
        animation: object_two 1s infinite;
    }
    -sharpobject_three {
        -webkit-animation: object_three 1s infinite;
        animation: object_three 1s infinite;
    }
    -sharpobject_four {
        -webkit-animation: object_four 1s infinite;
        animation: object_four 1s infinite;
    }
    @-webkit-keyframes loading-center-absolute {
        100% {
            -ms-transform: rotate(360deg);
            -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
        }
    }
    @keyframes loading-center-absolute {
        100% {
            -ms-transform: rotate(360deg);
            -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
        }
    }
    @-webkit-keyframes object_one {
        50% {
            -ms-transform: translate(20px, 20px);
            -webkit-transform: translate(20px, 20px);
            transform: translate(20px, 20px);
        }
    }
    @keyframes object_one {
        50% {
            -ms-transform: translate(20px, 20px);
            -webkit-transform: translate(20px, 20px);
            transform: translate(20px, 20px);
        }
    }
    @-webkit-keyframes object_two {
        50% {
            -ms-transform: translate(-20px, 20px);
            -webkit-transform: translate(-20px, 20px);
            transform: translate(-20px, 20px);
        }
    }
    @keyframes object_two {
        50% {
            -ms-transform: translate(-20px, 20px);
            -webkit-transform: translate(-20px, 20px);
            transform: translate(-20px, 20px);
        }
    }
    @-webkit-keyframes object_three {
        50% {
            -ms-transform: translate(20px, -20px);
            -webkit-transform: translate(20px, -20px);
            transform: translate(20px, -20px);
        }
    }
    @keyframes object_three {
        50% {
            -ms-transform: translate(20px, -20px);
            -webkit-transform: translate(20px, -20px);
            transform: translate(20px, -20px);
        }
    }
    @-webkit-keyframes object_four {
        50% {
            -ms-transform: translate(-20px, -20px);
            -webkit-transform: translate(-20px, -20px);
            transform: translate(-20px, -20px);
        }
    }
    @keyframes object_four {
        50% {
            -ms-transform: translate(-20px, -20px);
            -webkit-transform: translate(-20px, -20px);
            transform: translate(-20px, -20px);
        }
    }
  /* html */  
 <div id="loading">
        <div id="loading-center">
            <div id="loading-center-absolute">
                <div class="object" id="object_one"></div>
                <div class="object" id="object_two"></div>
                <div class="object" id="object_three"></div>
                <div class="object" id="object_four"></div>
            </div>
        </div>
    </div>