Yo : ./style/lib/ani/elastic-in.scss
源代码
源代码
@charset "utf-8"; @import "classes"; /** * @module elastic * @description 定义弹性进入动画 * @method elastic-in */ @-webkit-keyframes elastic-in { 0% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); } 20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); } 40% { -webkit-transform: scale3d(.9, .9, .9); } 60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); } 80% { -webkit-transform: scale3d(.97, .97, .97); } 100% { opacity: 1; -webkit-transform: scale3d(1, 1, 1); } } @keyframes elastic-in { 0% { opacity: 0; transform: scale3d(.3, .3, .3); } 20% { transform: scale3d(1.1, 1.1, 1.1); } 40% { transform: scale3d(.9, .9, .9); } 60% { opacity: 1; transform: scale3d(1.03, 1.03, 1.03); } 80% { transform: scale3d(.97, .97, .97); } 100% { opacity: 1; transform: scale3d(1, 1, 1); } } .ani.elastic-in { -webkit-animation-name: elastic-in; animation-name: elastic-in; }