css动画实现loading效果

css animation 动画实现loading状态
HTML
<div class=”root”></div>
CSS
.root {
width: 25px;
height: 25px;
border-radius: 50px;
border: 2px dashed #ddeeff;
animation: loading 1s infinite linear;
}

@keyframes loading {
to {
transform: rotate(180deg)
}
}

JavaScript

setTimeout(() => {
$(‘.root’).css({
‘animation-play-state’: ‘paused’
})
}, 5000)