数据到来前的样式
.container {
-webkit-filter: blur(10px);
-moz-filter: blur(10px);
-ms-filter: blur(10px);
filter: blur(10px);
}
数据到来后增加hidden class
/* 隐藏 */
.hidden {
-webkit-filter: blur(0px); /* Chrome, Opera */
-moz-filter: blur(0px);
-ms-filter: blur(0px);
filter: blur(0px);
animation: blur 0.3s;
}
@keyframes blur {
from {
-webkit-filter: blur(10px); /* Chrome, Opera */
-moz-filter: blur(10px);
-ms-filter: blur(10px);
filter: blur(10px);
}
to {
-webkit-filter: blur(0px); /* Chrome, Opera */
-moz-filter: blur(0px);
-ms-filter: blur(0px);
filter: blur(0px);
}
}
