[加载动画9]
查看 源码
html
<div class="loadingNine"> <span></span> <span></span> <span></span> <span></span> <span></span> </div>
css
.loadingNine{
width: 150px;
height: 15px;
margin: 0 auto;
margin-top:100px;
text-align: center;
}
.loadingNine span{
display: inline-block;
width: 15px;
height: 100%;
margin-right: 5px;
background: lightgreen;
-webkit-animation: loadnine 1.04s ease infinite;
}
.loadingNine span:last-child{
margin-right: 0px;
}
@-webkit-keyframes loadnine{
0%{
opacity: 1;
-webkit-transform: scale(1.2);
}
100%{
opacity: .2;
-webkit-transform: scale(.2);
}
}
.loadingNine span:nth-child(1){
-webkit-animation-delay:0.13s;
}
.loadingNine span:nth-child(2){
-webkit-animation-delay:0.26s;
}
.loadingNine span:nth-child(3){
-webkit-animation-delay:0.39s;
}
.loadingNine span:nth-child(4){
-webkit-animation-delay:0.52s;
}
.loadingNine span:nth-child(5){
-webkit-animation-delay:0.65s;
}
[加载动画10]
查看源码
html
<div class="loadingTen"> <span></span> </div>
css
.loadingTen{
width: 150px;
height: 8px;
border-radius: 4px;
margin: 0 auto;
margin-top:100px;
position: relative;
background: lightblue;
overflow: hidden;
}
.loadingTen span{
display:block;
width: 100%;
height: 100%;
border-radius: 3px;
background: lightgreen;
-webkit-animation: changePosition 4s linear infinite;
}
@-webkit-keyframes changePosition{
0%{
-webkit-transform: translate(-150px);
}
50%{
-webkit-transform: translate(0);
}
100%{
-webkit-transform: translate(150px);
}
}
[加载动画11]
查看源码
html
<div class="loadingEleven"> <span></span> <span></span> <span></span> <span></span> <span></span> <span></span> <span></span> <span></span> </div>
css
.loadingEleven{
width: 100px;
height: 100px;
position: relative;
margin: 0 auto;
margin-top:100px;
}
.loadingEleven span{
display: inline-block;
width: 30px;
height: 10px;
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
background: lightgreen;
position: absolute;
-webkit-animation: loadeleven 1.04s ease infinite;
}
@-webkit-keyframes loadeleven{
0%{
opacity: 1;
}
100%{
opacity: 0.2;
}
}
.loadingEleven span:nth-child(1){
left: 0;
top: 50%;
margin-top:-5px;
-webkit-animation-delay:0.13s;
}
.loadingEleven span:nth-child(2){
left: 10px;
top: 20px;
-webkit-transform: rotate(45deg);
-webkit-animation-delay:0.26s;
}
.loadingEleven span:nth-child(3){
left: 50%;
top: 10px;
margin-left: -15px;
-webkit-transform: rotate(90deg);
-webkit-animation-delay:0.39s;
}
.loadingEleven span:nth-child(4){
top: 20px;
right:10px;
-webkit-transform: rotate(135deg);
-webkit-animation-delay:0.52s;
}
.loadingEleven span:nth-child(5){
right: 0;
top: 50%;
margin-top:-5px;
-webkit-transform: rotate(180deg);
-webkit-animation-delay:0.65s;
}
.loadingEleven span:nth-child(6){
right: 10px;
bottom:20px;
-webkit-transform: rotate(225deg);
-webkit-animation-delay:0.78s;
}
.loadingEleven span:nth-child(7){
bottom: 10px;
left: 50%;
margin-left: -15px;
-webkit-transform: rotate(270deg);
-webkit-animation-delay:0.91s;
}
.loadingEleven span:nth-child(8){
bottom: 20px;
left: 10px;
-webkit-transform: rotate(315deg);
-webkit-animation-delay:1.04s;
}
[加载动画12]
查看源码
html
<div class="loadingTwl"> <span></span> <span></span> <span></span> <span></span> <span></span> </div>
css
.loadingTwl{
position:relative;
width: 100px;
height: 50px;
position: relative;
margin: 0 auto;
}
.loadingTwl span{
display:block;
bottom:0px;
width: 9px;
height: 5px;
background:#9b59b6;
position:absolute;
-webkit-animation: loadingtwl 1.5s infinite ease-in-out;
-moz-animation: loadingtwl 1.5s infinite ease-in-out;
-ms-animation: loadingtwl 1.5s infinite ease-in-out;
-o-animation: loadingtwl 1.5s infinite ease-in-out;
animation: loadingtwl 1.5s infinite ease-in-out;
}
.loadingTwl span:nth-child(2){
left:11px;
-webkit-animation-delay: .2s;
-moz-animation-delay: .2s;
-ms-animation-delay: .2s;
-o-animation-delay: .2s;
animation-delay: .2s;
}
.loadingTwl span:nth-child(3){
left:22px;
-webkit-animation-delay: .4s;
-moz-animation-delay: .4s;
-ms-animation-delay: .4s;
-o-animation-delay: .4s;
animation-delay: .4s;
}
.loadingTwl span:nth-child(4){
left:33px;
-webkit-animation-delay: .6s;
-moz-animation-delay: .6s;
-ms-animation-delay: .6s;
-o-animation-delay: .6s;
animation-delay: .6s;
}
.loadingTwl span:nth-child(5){
left:44px;
-webkit-animation-delay: .8s;
-moz-animation-delay: .8s;
-ms-animation-delay: .8s;
-o-animation-delay: .8s;
animation-delay: .8s;
}
@-webkit-keyframes loadingtwl {
0% {height:5px;-webkit-transform:translateY(0px);background:#9b59b6;}
25% {height:30px;-webkit-transform:translateY(15px);background:#3498db;}
50% {height:5px;-webkit-transform:translateY(0px);background:#9b59b6;}
100% {height:5px;-webkit-transform:translateY(0px);background:#9b59b6;}
}
@-moz-keyframes loadingtwl {
0% {height:5px;-moz-transform:translateY(0px);background:#9b59b6;}
25% {height:30px;-moz-transform:translateY(15px);background:#3498db;}
50% {height:5px;-moz-transform:translateY(0px);background:#9b59b6;}
100% {height:5px;-moz-transform:translateY(0px);background:#9b59b6;}
}
@-ms-keyframes loadingtwl {
0% {height:5px;-ms-transform:translateY(0px);background:#9b59b6;}
25% {height:30px;-ms-transform:translateY(15px);background:#3498db;}
50% {height:5px;-ms-transform:translateY(0px);background:#9b59b6;}
100% {height:5px;-ms-transform:translateY(0px);background:#9b59b6;}
}
@keyframes loadingtwl {
0% {height:5px;transform:translateY(0px);background:#9b59b6;}
25% {height:30px;transform:translateY(15px);background:#3498db;}
50% {height:5px;transform:translateY(0px);background:#9b59b6;}
100% {height:5px;transform:translateY(0px);background:#9b59b6;}
}
[加载动画13]
查看源码
html
<div class="loadingThi"> <span></span> <span></span> <span></span> <span></span> </div>
css
.loadingThi{
position: relative;
width: 40px;
height: 40px;
margin:0 auto;
}
.loadingThi span{
display:block;
bottom:0px;
width: 20px;
height: 20px;
background:#9b59b6;
position:absolute;
}
.loadingThi span:nth-child(1){
-webkit-animation: loadingThi2_1 1.5s infinite ease-in-out;
-moz-animation: loadingThi2_1 1.5s infinite ease-in-out;
-ms-animation: loadingThi2_1 1.5s infinite ease-in-out;
animation: loadingThi2_1 1.5s infinite ease-in-out;
}
.loadingThi span:nth-child(2){
left:20px;
-webkit-animation: loadingThi2_2 1.5s infinite ease-in-out;
-moz-animation: loadingThi2_2 1.5s infinite ease-in-out;
-ms-animation: loadingThi2_2 1.5s infinite ease-in-out;
animation: loadingThi2_2 1.5s infinite ease-in-out;
}
.loadingThi span:nth-child(3){
top:0px;
-webkit-animation: loadingThi2_3 1.5s infinite ease-in-out;
-moz-animation: loadingThi2_3 1.5s infinite ease-in-out;
-ms-animation: loadingThi2_3 1.5s infinite ease-in-out;
animation: loadingThi2_3 1.5s infinite ease-in-out;
}
.loadingThi span:nth-child(4){
top:0px;
left:20px;
-webkit-animation: loadingThi2_4 1.5s infinite ease-in-out;
-moz-animation: loadingThi2_4 1.5s infinite ease-in-out;
-ms-animation: loadingThi2_4 1.5s infinite ease-in-out;
animation: loadingThi2_4 1.5s infinite ease-in-out;
}
@-webkit-keyframes loadingThi2_1 {
0% {-webkit-transform: translateX(0px) translateY(0px) rotate(0deg); border-radius:0px;}
50% {-webkit-transform: translateX(-20px) translateY(-10px) rotate(-180deg); border-radius:20px;background:#3498db;}
80% {-webkit-transform: translateX(0px) translateY(0px) rotate(-360deg); border-radius:0px;}
100% {-webkit-transform: translateX(0px) translateY(0px) rotate(-360deg); border-radius:0px;}
}
@-webkit-keyframes loadingThi2_2 {
0% {-webkit-transform: translateX(0px) translateY(0px) rotate(0deg);border-radius:0px;}
50% {-webkit-transform: translateX(20px) translateY(-10px) rotate(180deg);border-radius:20px;background:#f1c40f;}
80% {-webkit-transform: translateX(0px) translateY(0px) rotate(360deg);border-radius:0px;}
100% {-webkit-transform: translateX(0px) translateY(0px) rotate(360deg);border-radius:0px;}
}
@-webkit-keyframes loadingThi2_3 {
0% {-webkit-transform: translateX(0px) translateY(0px) rotate(0deg);border-radius:0px;}
50% {-webkit-transform: translateX(-20px) translateY(10px) rotate(-180deg); border-radius:20px;background:#2ecc71;}
80% {-webkit-transform: translateX(0px) translateY(0px) rotate(-360deg);border-radius:0px;}
100% {-webkit-transform: translateX(0px) translateY(0px) rotate(-360deg); border-radius:0px;}
}
@-webkit-keyframes loadingThi2_4 {
0% {-webkit-transform: translateX(0px) translateY(0px) rotate(0deg); border-radius:0px;}
50% {-webkit-transform: translateX(20px) translateY(10px) rotate(180deg); border-radius:20px;background:#e74c3c;}
80% {-webkit-transform: translateX(0px) translateY(0px) rotate(360deg); border-radius:0px;}
100% {-webkit-transform: translateX(0px) translateY(0px) rotate(360deg);border-radius:0px;}
}
@-moz-keyframes loadingThi2_1 {
0% {-moz-transform: translateX(0px) translateY(0px) rotate(0deg); border-radius:0px;}
50% {-moz-transform: translateX(-20px) translateY(-10px) rotate(-180deg); border-radius:20px;background:#3498db;}
80% {-moz-transform: translateX(0px) translateY(0px) rotate(-360deg); border-radius:0px;}
100% {-moz-transform: translateX(0px) translateY(0px) rotate(-360deg); border-radius:0px;}
}
@-moz-keyframes loadingThi2_2 {
0% {-moz-transform: translateX(0px) translateY(0px) rotate(0deg);border-radius:0px;}
50% {-moz-transform: translateX(20px) translateY(-10px) rotate(180deg);border-radius:20px;background:#f1c40f;}
80% {-moz-transform: translateX(0px) translateY(0px) rotate(360deg);border-radius:0px;}
100% {-moz-transform: translateX(0px) translateY(0px) rotate(360deg);border-radius:0px;}
}
@-moz-keyframes loadingThi2_3 {
0% {-moz-transform: translateX(0px) translateY(0px) rotate(0deg);border-radius:0px;}
50% {-moz-transform: translateX(-20px) translateY(10px) rotate(-180deg); border-radius:20px;background:#2ecc71;}
80% {-moz-transform: translateX(0px) translateY(0px) rotate(-360deg);border-radius:0px;}
100% {-moz-transform: translateX(0px) translateY(0px) rotate(-360deg); border-radius:0px;}
}
@-moz-keyframes loadingThi2_4 {
0% {-moz-transform: translateX(0px) translateY(0px) rotate(0deg); border-radius:0px;}
50% {-moz-transform: translateX(20px) translateY(10px) rotate(180deg); border-radius:20px;background:#e74c3c;}
80% {-moz-transform: translateX(0px) translateY(0px) rotate(360deg); border-radius:0px;}
100% {-moz-transform: translateX(0px) translateY(0px) rotate(360deg);border-radius:0px;}
}
@-ms-keyframes loadingThi2_1 {
0% {-ms-transform: translateX(0px) translateY(0px) rotate(0deg); border-radius:0px;}
50% {-ms-transform: translateX(-20px) translateY(-10px) rotate(-180deg); border-radius:20px;background:#3498db;}
80% {-ms-transform: translateX(0px) translateY(0px) rotate(-360deg); border-radius:0px;}
100% {-ms-transform: translateX(0px) translateY(0px) rotate(-360deg); border-radius:0px;}
}
@-ms-keyframes loadingThi2_2 {
0% {-ms-transform: translateX(0px) translateY(0px) rotate(0deg);border-radius:0px;}
50% {-ms-transform: translateX(20px) translateY(-10px) rotate(180deg);border-radius:20px;background:#f1c40f;}
80% {-ms-transform: translateX(0px) translateY(0px) rotate(360deg);border-radius:0px;}
100% {-ms-transform: translateX(0px) translateY(0px) rotate(360deg);border-radius:0px;}
}
@-ms-keyframes loadingThi2_3 {
0% {-ms-transform: translateX(0px) translateY(0px) rotate(0deg);border-radius:0px;}
50% {-ms-transform: translateX(-20px) translateY(10px) rotate(-180deg); border-radius:20px;background:#2ecc71;}
80% {-ms-transform: translateX(0px) translateY(0px) rotate(-360deg);border-radius:0px;}
100% {-ms-transform: translateX(0px) translateY(0px) rotate(-360deg); border-radius:0px;}
}
@-ms-keyframes loadingThi2_4 {
0% {-ms-transform: translateX(0px) translateY(0px) rotate(0deg); border-radius:0px;}
50% {-ms-transform: translateX(20px) translateY(10px) rotate(180deg); border-radius:20px;background:#e74c3c;}
80% {-ms-transform: translateX(0px) translateY(0px) rotate(360deg); border-radius:0px;}
100% {-ms-transform: translateX(0px) translateY(0px) rotate(360deg);border-radius:0px;}
}
@-keyframes loadingThi2_1 {
0% {-transform: translateX(0px) translateY(0px) rotate(0deg); border-radius:0px;}
50% {-transform: translateX(-20px) translateY(-10px) rotate(-180deg); border-radius:20px;background:#3498db;}
80% {-transform: translateX(0px) translateY(0px) rotate(-360deg); border-radius:0px;}
100% {-transform: translateX(0px) translateY(0px) rotate(-360deg); border-radius:0px;}
}
@-keyframes loadingThi2_2 {
0% {-transform: translateX(0px) translateY(0px) rotate(0deg);border-radius:0px;}
50% {-transform: translateX(20px) translateY(-10px) rotate(180deg);border-radius:20px;background:#f1c40f;}
80% {-transform: translateX(0px) translateY(0px) rotate(360deg);border-radius:0px;}
100% {-transform: translateX(0px) translateY(0px) rotate(360deg);border-radius:0px;}
}
@-keyframes loadingThi2_3 {
0% {-transform: translateX(0px) translateY(0px) rotate(0deg);border-radius:0px;}
50% {-transform: translateX(-20px) translateY(10px) rotate(-180deg); border-radius:20px;background:#2ecc71;}
80% {-transform: translateX(0px) translateY(0px) rotate(-360deg);border-radius:0px;}
100% {-transform: translateX(0px) translateY(0px) rotate(-360deg); border-radius:0px;}
}
@-keyframes loadingThi2_4 {
0% {-transform: translateX(0px) translateY(0px) rotate(0deg); border-radius:0px;}
50% {-transform: translateX(20px) translateY(10px) rotate(180deg); border-radius:20px;background:#e74c3c;}
80% {-transform: translateX(0px) translateY(0px) rotate(360deg); border-radius:0px;}
100% {-transform: translateX(0px) translateY(0px) rotate(360deg);border-radius:0px;}
}
[加载动画14]
查看源码
html
<div class="loadingThir"></div>
css
.loadingThir{
position:relative;
width: 40px;
height: 40px;
margin:0 auto;
}
.loadingThir:before{
width:20px;
height:20px;
border-radius:20px;
background:blue;
content:'';
position:absolute;
background:#9b59b6;
-webkit-animation: preloader_3_before 1.5s infinite ease-in-out;
-moz-animation: preloader_3_before 1.5s infinite ease-in-out;
-ms-animation: preloader_3_before 1.5s infinite ease-in-out;
animation: preloader_3_before 1.5s infinite ease-in-out;
}
.loadingThir:after{
width:20px;
height:20px;
border-radius:20px;
background:blue;
content:'';
position:absolute;
background:#2ecc71;
left:22px;
-webkit-animation: preloader_3_after 1.5s infinite ease-in-out;
-moz-animation: preloader_3_after 1.5s infinite ease-in-out;
-ms-animation: preloader_3_after 1.5s infinite ease-in-out;
animation: preloader_3_after 1.5s infinite ease-in-out;
}
@-webkit-keyframes preloader_3_before {
0% {-webkit-transform: translateX(0px) rotate(0deg)}
50% {-webkit-transform: translateX(50px) scale(1.2) rotate(260deg); background:#2ecc71;border-radius:0px;}
100% {-webkit-transform: translateX(0px) rotate(0deg)}
}
@-webkit-keyframes preloader_3_after {
0% {-webkit-transform: translateX(0px)}
50% {-webkit-transform: translateX(-50px) scale(1.2) rotate(-260deg);background:#9b59b6;border-radius:0px;}
100% {-webkit-transform: translateX(0px)}
}
@-moz-keyframes preloader_3_before {
0% {-moz-transform: translateX(0px) rotate(0deg)}
50% {-moz-transform: translateX(50px) scale(1.2) rotate(260deg); background:#2ecc71;border-radius:0px;}
100% {-moz-transform: translateX(0px) rotate(0deg)}
}
@-moz-keyframes preloader_3_after {
0% {-moz-transform: translateX(0px)}
50% {-moz-transform: translateX(-50px) scale(1.2) rotate(-260deg);background:#9b59b6;border-radius:0px;}
100% {-moz-transform: translateX(0px)}
}
@-ms-keyframes preloader_3_before {
0% {-ms-transform: translateX(0px) rotate(0deg)}
50% {-ms-transform: translateX(50px) scale(1.2) rotate(260deg); background:#2ecc71;border-radius:0px;}
100% {-ms-transform: translateX(0px) rotate(0deg)}
}
@-ms-keyframes preloader_3_after {
0% {-ms-transform: translateX(0px)}
50% {-ms-transform: translateX(-50px) scale(1.2) rotate(-260deg);background:#9b59b6;border-radius:0px;}
100% {-ms-transform: translateX(0px)}
}
@keyframes preloader_3_before {
0% {transform: translateX(0px) rotate(0deg)}
50% {transform: translateX(50px) scale(1.2) rotate(260deg); background:#2ecc71;border-radius:0px;}
100% {transform: translateX(0px) rotate(0deg)}
}
@keyframes preloader_3_after {
0% {transform: translateX(0px)}
50% {transform: translateX(-50px) scale(1.2) rotate(-260deg);background:#9b59b6;border-radius:0px;}
100% {transform: translateX(0px)}
}
[加载动画15]
查看源码
html
<div class="loadingFiv"></div>
css
.loadingFiv{
position:relative;
width:30px;
height:30px;
background:#3498db;
border-radius:50px;
-webkit-animation: preloader_5 1.5s infinite linear;
-moz-animation: preloader_5 1.5s infinite linear;
-ms-animation: preloader_5 1.5s infinite linear;
animation: preloader_5 1.5s infinite linear;
margin:0 auto;
}
.loadingFiv:after{
position:absolute;
width:50px;
height:50px;
border-top:10px solid #9b59b6;
border-bottom:10px solid #9b59b6;
border-left:10px solid transparent;
border-right:10px solid transparent;
border-radius:50px;
content:'';
top:-20px;
left:-20px;
-webkit-animation: preloader_5_after 1.5s infinite linear;
-moz-animation: preloader_5_after 1.5s infinite linear;
-ms-animation: preloader_5_after 1.5s infinite linear;
animation: preloader_5_after 1.5s infinite linear;
}
@-webkit-keyframes preloader_5 {
0% {-webkit-transform: rotate(0deg);}
50% {-webkit-transform: rotate(180deg);background:#2ecc71;}
100% {-webkit-transform: rotate(360deg);}
}
@-webkit-keyframes preloader_5_after {
0% {border-top:10px solid #9b59b6;border-bottom:10px solid #9b59b6;}
50% {border-top:10px solid #3498db;border-bottom:10px solid #3498db;}
100% {border-top:10px solid #9b59b6;border-bottom:10px solid #9b59b6;}
}
@-moz-keyframes preloader_5 {
0% {-moz-transform: rotate(0deg);}
50% {-moz-transform: rotate(180deg);background:#2ecc71;}
100% {-moz-transform: rotate(360deg);}
}
@-moz-keyframes preloader_5_after {
0% {border-top:10px solid #9b59b6;border-bottom:10px solid #9b59b6;}
50% {border-top:10px solid #3498db;border-bottom:10px solid #3498db;}
100% {border-top:10px solid #9b59b6;border-bottom:10px solid #9b59b6;}
}
@-ms-keyframes preloader_5 {
0% {-ms-transform: rotate(0deg);}
50% {-ms-transform: rotate(180deg);background:#2ecc71;}
100% {-ms-transform: rotate(360deg);}
}
@-ms-keyframes preloader_5_after {
0% {border-top:10px solid #9b59b6;border-bottom:10px solid #9b59b6;}
50% {border-top:10px solid #3498db;border-bottom:10px solid #3498db;}
100% {border-top:10px solid #9b59b6;border-bottom:10px solid #9b59b6;}
}
@keyframes preloader_5 {
0% {transform: rotate(0deg);}
50% {transform: rotate(180deg);background:#2ecc71;}
100% {transform: rotate(360deg);}
}
@keyframes preloader_5_after {
0% {border-top:10px solid #9b59b6;border-bottom:10px solid #9b59b6;}
50% {border-top:10px solid #3498db;border-bottom:10px solid #3498db;}
100% {border-top:10px solid #9b59b6;border-bottom:10px solid #9b59b6;}
}
[加载动画16]
查看源码
html
<div class="loadingSixs"> <span></span> <span></span> <span></span> <span></span> </div>
css
.loadingSixs{
position:relative;
width: 42px;
height: 42px;
-webkit-animation: preloader_6 5s infinite linear;
-moz-animation: preloader_6 5s infinite linear;
-ms-animation: preloader_6 5s infinite linear;
animation: preloader_6 5s infinite linear;
margin:0 auto;
}
.loadingSixs span{
width:20px;
height:20px;
position:absolute;
background:red;
display:block;
-webkit-animation: preloader_6_span 1s infinite linear;
-moz-animation: preloader_6_span 1s infinite linear;
-ms-animation: preloader_6_span 1s infinite linear;
animation: preloader_6_span 1s infinite linear;
}
.loadingSixs span:nth-child(1){
background:#2ecc71;
}
.loadingSixs span:nth-child(2){
left:22px;
background:#9b59b6;
-webkit-animation-delay: .2s;
-moz-animation-delay: .2s;
-ms-animation-delay: .2s;
animation-delay: .2s;
}
.loadingSixs span:nth-child(3){
top:22px;
background:#3498db;
-webkit-animation-delay: .4s;
-moz-animation-delay: .4s;
-ms-animation-delay: .4s;
animation-delay: .4s;
}
.loadingSixs span:nth-child(4){
top:22px;
left:22px;
background:#f1c40f;
-webkit-animation-delay: .6s;
-moz-animation-delay: .6s;
-ms-animation-delay: .6s;
animation-delay: .6s;
}
@-webkit-keyframes preloader_6 {
from {-webkit-transform: rotate(0deg);}
to {-webkit-transform: rotate(360deg);}
}
@-webkit-keyframes preloader_6_span {
0% { -webkit-transform:scale(1); }
50% { -webkit-transform:scale(0.5); }
100% { -webkit-transform:scale(1); }
}
@-moz-keyframes preloader_6 {
from {-moz-transform: rotate(0deg);}
to {-moz-transform: rotate(360deg);}
}
@-moz-keyframes preloader_6_span {
0% { -moz-transform:scale(1); }
50% { -moz-transform:scale(0.5); }
100% { -moz-transform:scale(1); }
}
@-ms-keyframes preloader_6 {
from {-ms-transform: rotate(0deg);}
to {-ms-transform: rotate(360deg);}
}
@-ms-keyframes preloader_6_span {
0% { -ms-transform:scale(1); }
50% { -ms-transform:scale(0.5); }
100% { -ms-transform:scale(1); }
}
@-ms-keyframes preloader_6 {
from {-ms-transform: rotate(0deg);}
to {-ms-transform: rotate(360deg);}
}
@keyframes preloader_6_span {
0% { transform:scale(1); }
50% { transform:scale(0.5); }
100% { transform:scale(1); }
}







