I've made an sprite sheet animation in css and I want it to run only when the page is scrolled, the animation is fixed, how could i do that? here is my animation
#me{
background-image: url("walkingirl.png");
width: 200px;
height: 509px;
top: -151px;
left: 180px;
position: fixed;
animation: play 2s steps(10) infinite;
}
@keyframes play {
from { background-position: 0 0; }
to { background-position: -2000px 0; }
}