Как устранить мерцание последнего кадра свойства animate на iphone?
Хочу сделать круг над кнопкой, который будет увеличиваться и постепенно растворятся. написал такой код:
.circle::after {
content: "";
width: 30px;
height: 30px;
border-radius: 100%;
border: 6px solid #00ffcb;
position: absolute;
z-index: -1;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
animation: ring 1.5s infinite;
}
.call-oder-button:hover::after,
.call-oder-button:focus::after {
animation: none;
}
@keyframes ring {
0% {
width: 30px;
height: 30px;
opacity: 1;
}
100% {
width: 300px;
height: 300px;
opacity: 0;
}
}
<div class="circle">
ТЕСТОВАЯ КНОПКА
</div>
На последнем кадре (после того как круг исчез) на айфон он резко проявляется снова и потом анимация повторяется. Как это убрать???