CSS3的transform属性,怎么才能让他同时执行两个动画

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了CSS3的transform属性,怎么才能让他同时执行两个动画相关的知识,希望对你有一定的参考价值。

-webkit-transform:rotateX(120deg);
-webkit-transform:rotateY(55deg);
================================
只能执行一个啊,怎么才能让他们执行两个

参考技术A 你是要在 不同的时间内 执行两个动画 我这有个例子 你看下
#div61
background-color:#CC9966;
height:155px;
width:155px;
animation:dong 7s ease-in-out 0s 1 normal;
-moz-animation:dong 7s ease-in-out 0s 1 normal;
-webkit-animation:dong 7s ease-in-out 0s 1 normal;
-o-animation:dong 7s ease-in-out 0s 1 normal;

@keyframes dong
0%
transform:rotateX(0deg);

30%
transform:rotateX(120deg);

70%
background-color:#CC9966;

100%
background-color:red;


用火狐 或则 360 看下 我没去 搞 兼容 百度有 兼容的属性本回答被提问者和网友采纳

以上是关于CSS3的transform属性,怎么才能让他同时执行两个动画的主要内容,如果未能解决你的问题,请参考以下文章

css3 transform skew属性是怎么倾斜的

怎么用js获取到css3属性的值 比如获取transform的值

CSS3的transform属性的用法?

CSS3 Transform属性详解

CSS3 transform属性和过渡属性详解

CSS3 transform 缩放