css3实现颤动的动画

46次阅读

共计 616 个字符,预计需要花费 2 分钟才能阅读完成。

需求
页面要做一个活动入口,不能太显眼,但是又要用户能一眼就看出来。
演示
https://jsfiddle.net/vtsxc18q/
实现(部分动画代码)
@keyframes chanDong {
5% {
-webkit-transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -10deg);
transform: scale3d(1, 1, 1) rotate3d(0, 0, 1, -10deg);
}
6%,
8%,
10%,
12% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 10deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 10deg);
}

7%,
9%,
11% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -10deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -10deg);
}

13% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}

}
Github 代码
https://github.com/lmxdawn/te…
另附一个 vue 搭建的后台管理
另附一个 vue 搭建的后台管理 https://segmentfault.com/a/11…

正文完
 0