<view class="ponit"></view>
.ponit{
position: absolute;
top: 55%;
left: 50%;
z-index: 5;
width: 50rpx;
height: 50rpx;
background: #fff;
border-radius: 100%;
border: 1rpx solid #eee;
animation: ponitAnimation 1s infinite alternate;
}
@keyframes ponitAnimation{
10%{
box-shadow: 0 0 10rpx #fff;
}
28%{
box-shadow: 0 0 10rpx #fff, 0 0 15rpx #fff;
}
46%{
box-shadow: 0 0 10rpx #fff, 0 0 15rpx #fff,0 0 20rpx #fff;
}
52%{
box-shadow: 0 0 10rpx #fff, 0 0 15rpx #fff,0 0 20rpx #fff,0 0 25rpx #fff;
}
70%{
box-shadow: 0 0 10rpx #fff, 0 0 15rpx #fff,0 0 20rpx #fff,0 0 25rpx #fff,0 0 30rpx #fff;
}
90%{
box-shadow: 0 0 10rpx #fff, 0 0 15rpx #fff,0 0 20rpx #fff,0 0 25rpx #fff,0 0 30rpx #fff,0 0 35rpx #fff;
}
100%{
box-shadow: 0 0 10rpx #fff, 0 0 15rpx #fff,0 0 20rpx #fff,0 0 25rpx #fff,0 0 30rpx #fff,0 0 35rpx #fff,0 0 40rpx #fff;
}
}