Yo : ./style/lib/ani/elastic-y.scss
源代码
源代码
@charset "utf-8"; @import "classes"; /** * @module elastic * @description 定义Y轴弹性动画 * @method elastic-y */ @-webkit-keyframes elastic-y { 0%, 20%, 100% { -webkit-transform: translate3d(0, 0, 0); } 30% { -webkit-transform: translate3d(0, 20px, 0); } 50% { -webkit-transform: translate3d(0, -20px, 0); } 65% { -webkit-transform: translate3d(0, 10px, 0); } 80% { -webkit-transform: translate3d(0, -10px, 0); } 90% { -webkit-transform: translate3d(0, 5px, 0); } } @keyframes elastic-y { 0%, 20%, 100% { transform: translate3d(0, 0, 0); } 30% { transform: translate3d(0, 20px, 0); } 50% { transform: translate3d(0, -20px, 0); } 65% { transform: translate3d(0, 10px, 0); } 80% { transform: translate3d(0, -10px, 0); } 90% { transform: translate3d(0, 5px, 0); } } .ani.elastic-y { -webkit-animation-name: elastic-y; animation-name: elastic-y; }