我们正在开发一个使用SVG动画的Web应用程序(React)。我们的SVG动画在桌面Web和Android Web上运行良好,但在iOS设备上无法播放动画(在iPhone 5s、8和MacBook Pro上测试了Safari浏览器)。
const AnimationFooter = styled.div`
margin-top: -18rem;
height: auto;
width: 100%;
position: relative;
@media (max-width: 420px) {
margin-top: -15rem;
}
@media (max-width: 360px) {
margin-top: -14rem;
}
`;
const Im = styled.img`
width: 100%;
height: auto;
/* -webkit-transform: translateZ(0); */
@media (max-width: 420px) {
margin-top: 6px;
}
`;
<div>
<AnimationFooter>
<Im src="../static/images/home-image-ground.svg" />
</AnimationFooter>
</div>