How to set keyframes animation on slide change?

Question

css

Hello, there is such css code Stylys

.slider-item
  .slider-item__left
    transform: translate3d(50px,0,0)
    transition all .5s ease
    opacity 0
    transition-delay: 0.3s
    

  &.slick-current
    .slider-item__left
      transform: translateX(0)
      opacity 1
    .slider-item__right
      animation-name: bounce; 
      animation-duration: .5s; 
      animation-fill-mode: both;
      
@keyframes bounce  
  0%
    opacity 0
    transform: translateX(70px)
  50%
    opacity 0.5
    transform: translateX(-30px)
  100%
    opacity 1
    transform: translateX(0)

Slider Item Left which just moves works great. The slide changes, it is given the class s lick current and .slider-item__left animates each time. But for slider-item__right where the animation from Keyframes is going on, it works only Once . When loading the page. How can I make this animation run similarly to the left side

Answer 1

Everything worked fine) it was just too much, it was necessary to add animation-delay)