Почему моя анимация листа спрайтов скользит? - PullRequest
0 голосов
/ 16 июня 2020

Попытка реализовать анимацию листа спрайтов через css. Я последовал этому примеру

https://codepen.io/SitePoint/pen/zxXrzP

Однако моя анимация скользит вертикально, и я не могу понять почему. Любой вклад приветствуется.

.parent {
  position: relative;
  width: 70%;
  margin: -10% auto 0 auto; /* positioning tweak */
}


.parent:before {
  content: "";
  display: block;
  padding-top: 61.37%; 
}


.ryu {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;

  background-image:  url("http://dev.froststudio.se/wp-content/uploads/2020/06/frostcell_v03.png");
  background-size: 100%;
  animation: sprite 4s steps(79) forwards;
}

@keyframes sprite {
  from { background-position: 0 0%; }
  to { background-position: 0 100%; }
}

http://dev.froststudio.se

Ура,

...