Question

我正在使用

transform: scaleY(0.8);

在a：hover事件中。有没有办法随着时间的推移进行这种转变？我知道过渡事物的唯一方法就是

-webkit-transition: someparm sometime somefunction;
-moz-transition: someparm sometime somefunction;
-o-transition: someparm sometime somefunction;
transition: someparm sometime somefunction;

但是我无法弄清楚如何通过变换来实现它。

Answer 1

transition: transform 0.4s ease-in-out 0s;

或

transition-property: transform;
transition-duration: 0.4s;
transition-timing-function: ease-in-out;
transition-delay: 0s;

这样的事情

a {
  transform:scale(1);
  transition: transform 0.4s ease-in-out 0s;
}
a:hover {
    transform:scale(0.8);
}

Answer 2

@keyframes scale {
    100% { transform:scaleY(0.8);}
    }

/* on hover */

abc:hover{
-webkit-animation:scale 3s ease infinite;
}

**尝试动画**

有没有办法转换转换：scale属性只使用css？

2 个答案: