解决ie不能加载过度效果 #13

about.html

@@ -24,7 +24,6 @@
     <div id="top_nav" class="header_scroll">
         <div class="main_body clear">
             <a class="logo left" href="./index.html#header">
-                <img src="./images/logo-02.svg" alt="" class="left">
             </a>
             <div class="nav right">
                 <a class="nav_first" href="./index.html#header">首页</a>

contactus.html

@@ -24,7 +24,6 @@
     <div id="top_nav" class="header_scroll">
         <div class="main_body clear">
             <a class="logo left" href="./index.html#header">
-                <img src="./images/logo-02.svg" alt="" class="left"> 
             </a>
             <div class="nav right">
                 <a class="nav_first" href="./index.html#header">首页</a>
@@ -122,12 +121,17 @@
             <div class="market">
                 <div class="circleProgress_wrapper">
                     <div class="rightcircle_on"></div>
+                    <!-- 右半边圆 -->
                     <div class="wrapper right">
-                        <div class="circleProgress rightcircle"><div class="rightcircle_right"></div></div>
-                        
+                        <div class="circleProgress rightcircle">
+                            <div class="rightcircle_right"></div>
+                        </div>
                     </div>
+                    <!-- 左半边圆 -->
                     <div class="wrapper left">
-                        <div class="circleProgress leftcircle"><div class="leftcircle_left"></div></div>
+                        <div class="circleProgress leftcircle">
+                            <div class="leftcircle_left"></div>
+                        </div>
                     </div>
                 </div>
                 <div class="text">

css/contactus.css

@@ -232,18 +232,21 @@
     position: absolute;
     top:0;
     -webkit-transform: rotate(-135deg);
+    -ms-transform: rotate(-135deg);
 }
 .circleProgress_wrapper .wrapper .rightcircle{
     border-top:20px solid #12ab8d;
     border-right:20px solid #12ab8d;
     right:0;
     -webkit-animation: circleProgressLoad_right 2s linear forwards;
+    -ms-animation: circleProgressLoad_right 2s linear forwards;
 }
 .circleProgress_wrapper .wrapper .leftcircle{
     border-bottom:20px solid #12ab8d;
     border-left:20px solid #12ab8d;
     left:0;
     -webkit-animation: circleProgressLoad_left 2s linear forwards;
+    -ms-animation: circleProgressLoad_left 2s linear forwards;
 }
 @-webkit-keyframes circleProgressLoad_right{
     0%{
@@ -253,12 +256,30 @@
         -webkit-transform: rotate(45deg);
     }
 }
+@-ms-keyframes circleProgressLoad_right{
+    0%{
+        -ms-transform: rotate(-135deg);
+    }
+    50%,100%{
+        -ms-transform: rotate(45deg);
+    }
+}
 @-webkit-keyframes circleProgressLoad_left{
     0%,50%{
         -webkit-transform: rotate(-135deg);
+        -ms-transform: rotate(-135deg);
     }
     100%{
         -webkit-transform: rotate(-15deg);
+        -ms-transform: rotate(-15deg);
+    }
+}
+@-ms-keyframes circleProgressLoad_left{
+    0%,50%{
+        -ms-transform: rotate(-135deg);
+    }
+    100%{
+        -ms-transform: rotate(-15deg);
     }
 }
 .circleProgress_wrapper .right{