数字滚动停止

用HTML，CSS3,JS完成功能的实现

（HTML代码：利用ul完成数字的排列）

（css样式：对样式进行调整，并设置滚动的距离，一般从top移动到-top）

.pdzrs1,
.pdzrs2,
.pdzrs3,
{
width: 2.5rem;
height: 2.875rem;
margin-right: 0.3125rem;
overflow: hidden;
}

.pdzrs1 li,
.pdzrs2 li,
.pdzrs3 li, {
width: 2.5rem;
height: 2.875rem;
margin-right: 0.3125rem;
font-size: 1.875rem;
text-align: center;
line-height: 2.875rem;
color: #FFFFFF;
background: url(…/img/13.png) no-repeat;
background-size: 100% 100%;
}
动态效果：需要停止到那个数字，就设置那个
//停止到数字2
.numb_2 {
margin-top: -5.75rem;
animation: mynumb_2 3s;
}
@keyframes mynumb_2 {
from {
margin-top: 0px;
}

to {
	margin-top: -5.75rem;
}

}
//停止到数字3
.numb_3 {
margin-top: -8.625rem;
animation: mynumb_3 3s;
}
@keyframes mynumb_3 {
from {
margin-top: 0px;
}

to {
	margin-top: -8.625rem;
}

}
//停止到数字3
.numb_4 {
margin-top: -11.5rem;
animation: mynumb_4 3s;
}
@keyframes mynumb_4 {
from {
margin-top: 0px;
}

to {
	margin-top: -11.5rem;
}

}

（vue代码:绑定样式）
pdzrs1: ‘numb_6’,
pdzrs2: ‘numb_5’,
pdzrs3: ‘numb_8’,
pdzrs4: ‘numb_7’,
pdzrs5: ‘numb_2’,
pdzrs6: ‘numb_5’,