I created a flash animation, now I want to add to Html, but I have no idea how to rotate the cover, it always rotate more, does any have some idea?
like as below css
.story-pot-cover{
animation: roatePotCover .2s linear infinite alternate;
}
.story-pot-cover-top{
animation: roatePotCover .2s linear infinite alternate;
}
@keyframes roatePotCover {
0%{
transform: translate(4px , -8px) rotate(11deg);
}
40%{
transform: translate(4px , -6px) rotate(11deg);
}
70%{
transform: translate(3px , 0px) rotate(0deg);
}
100%{
transform: translate(3px , 0px) rotate(0deg);
}
}
