我在使用CSS动画时遇到了一些问题,我使用Chrome开发了我的代码,但现在我在不同的浏览器上测试它我在Safari浏览器上运行时遇到了麻烦。
我的CSS代码
.fade-in {
opacity: 0;
-webkit-animation: fadeIn ease-in 1;
-moz-animation: fadeIn ease-in 1;
-o-animation: fadeIn ease-in 1;
animation: fadeIn ease-in 1;
-webkit-animation-fill-mode: forwards;
-moz-animation-fill-mode: forwards;
-o-animation-fill-mode: forwards;
animation-fill-mode: forwards;
-webkit-animation-duration: .5s;
-moz-animation-duration: .5s;
-o-animation-duration: .5s;
animation-duration: .5s
}
.one {
-webkit-animation-delay: .2s;
-moz-animation-delay: .2s;
-o-animation-delay: .2s;
animation-delay: .2s
}
.two {
-webkit-animation-delay: .5s;
-moz-animation-delay: .5s;
-o-animation-delay: .5s;
animation-delay: .5s
}
.three {
-webkit-animation-delay: .8s;
-moz-animation-delay: .8s;
-o-animation-delay: .8s;
animation-delay: .8s
}
.four {
-webkit-animation-delay: 1.3s;
-moz-animation-delay: 1.3s;
-o-animation-delay: 1.3s;
animation-delay: 1.3s
}
.five {
-webkit-animation-delay: 1.7s;
-moz-animation-delay: 1.7s;
-o-animation-delay: 1.7s;
animation-delay: 1.7s
}
.six {
-webkit-animation-delay: 2.2s;
-moz-animation-delay: 2.2s;
-o-animation-delay: 2.2s;
animation-delay: 2.2s
}
此代码剂量是在页面加载时命令fadein动画。
提前谢谢