css渲染完成ajax才加载,JQuery+CSS3实现Ajax加载时loading效果

#fountainG{position:relative;margin:10% auto;width:240px;height:29px}.fountainG{position:absolute;top:0;background-color:#33cc99;width:29px;height:29px;-webkit-animation:bounce_fountainG 1.3s infinite normal;-moz-animation:bounce_fountainG 1.3s infinite normal;-o-animation:bounce_fountainG 1.3s infinite normal;-ms-animation:bounce_fountainG 1.3s infinite normal;animation:bounce_fountainG 1.3s infinite normal;-moz-transform:scale(.3);-webkit-transform:scale(.3);-ms-transform:scale(.3);-o-transform:scale(.3);transform:scale(.3);border-radius:19px;

}#fountainG_1{left:0;-moz-animation-delay:0.52s;-webkit-animation-delay:0.52s;-ms-animation-delay:0.52s;-o-animation-delay:0.52s;animation-delay:0.52s;

}#fountainG_2{left:30px;-moz-animation-delay:0.65s;-webkit-animation-delay:0.65s;-ms-animation-delay:0.65s;-o-animation-delay:0.65s;animation-delay:0.65s;

}#fountainG_3{left:60px;-moz-animation-delay:0.78s;-webkit-animation-delay:0.78s;-ms-animation-delay:0.78s;-o-animation-delay:0.78s;animation-delay:0.78s;

}#fountainG_4{left:90px;-moz-animation-delay:0.91s;-webkit-animation-delay:0.91s;-ms-animation-delay:0.91s;-o-animation-delay:0.91s;animation-delay:0.91s;

}#fountainG_5{left:120px;-moz-animation-delay:1.04s;-webkit-animation-delay:1.04s;-ms-animation-delay:1.04s;-o-animation-delay:1.04s;animation-delay:1.04s;

}#fountainG_6{left:150px;-moz-animation-delay:1.17s;-webkit-animation-delay:1.17s;-ms-animation-delay:1.17s;-o-animation-delay:1.17s;animation-delay:1.17s;

}#fountainG_7{left:180px;-moz-animation-delay:1.3s;-webkit-animation-delay:1.3s;-ms-animation-delay:1.3s;-o-animation-delay:1.3s;animation-delay:1.3s;

}#fountainG_8{left:210px;-moz-animation-delay:1.43s;-webkit-animation-delay:1.43s;-ms-animation-delay:1.43s;-o-animation-delay:1.43s;animation-delay:1.43s;

}@-moz-keyframes bounce_fountainG{0%{

-moz-transform:scale(1);background-color:#33cc99;

}100%{-moz-transform:scale(.3);background-color:#0099cc;

}}

@-webkit-keyframes bounce_fountainG{0%{

-webkit-transform:scale(1);background-color:#33cc99;

}100%{-webkit-transform:scale(.3);background-color:#0099cc;

}}

@-ms-keyframes bounce_fountainG{0%{

-ms-transform:scale(1);background-color:#33cc99;

}100%{-ms-transform:scale(.3);background-color:#0099cc;

}}

@-o-keyframes bounce_fountainG{0%{

-o-transform:scale(1);background-color:#33cc99;

}100%{-o-transform:scale(.3);background-color:#0099cc;

}}

@keyframes bounce_fountainG{0%{

transform:scale(1);background-color:#33cc99;

}100%{transform:scale(.3);background-color:#0099cc;

}}