项目里用到,虽说是小东西比较零碎,又不能用gif代替,
but没有是大前端做不到的,看了老鸟的查了些css资料才实现,
<--- HTML ---->
<div class="loading">Loading</div>
<-- CSS -->
.loading:after {
overflow: hidden;
display: inline-block;
vertical-align: bottom;
-webkit-animation: ellipsis 2s infinite;
-moz-animation: ellipsis 2s infinite;
animation: ellipsis 2s infinite;
content: "\2026"; /* ascii code for the ellipsis character */
}
@-moz-keyframes ellipsis {
from {
width: 2px;
}
to {
width: 15px;
}
}
@-moz-keyframes ellipsis {
from {
width: 2px;
}
to {
width: 15px;
}
}
@-webkit-keyframes ellipsis {
from {
width: 2px;
}
to {
width: 15px;
}
}