anicollection
Version:
AniCollection, The easiest way to find, use and share CSS3 animations.
12 lines • 2.53 kB
JSON
{
"name": "zoomOutUp",
"className": "zoomOutUp animated",
"cssCode": "@-webkit-keyframes zoomOutUp {\n 40% {\n opacity: 1;\n -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);\n transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);\n -webkit-animation-timing-function: cubic-bezier(0.55, .055, .675, .19);\n animation-timing-function: cubic-bezier(0.55, .055, .675, .19)\n }\n 100% {\n opacity: 0;\n -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);\n transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);\n -webkit-transform-origin: center bottom;\n transform-origin: center bottom;\n -webkit-animation-timing-function: cubic-bezier(0.175, .885, .32, 1);\n animation-timing-function: cubic-bezier(0.175, .885, .32, 1)\n }\n}\n\n@keyframes zoomOutUp {\n 40% {\n opacity: 1;\n -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);\n -ms-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);\n transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);\n -webkit-animation-timing-function: cubic-bezier(0.55, .055, .675, .19);\n animation-timing-function: cubic-bezier(0.55, .055, .675, .19)\n }\n 100% {\n opacity: 0;\n -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);\n -ms-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);\n transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);\n -webkit-transform-origin: center bottom;\n -ms-transform-origin: center bottom;\n transform-origin: center bottom;\n -webkit-animation-timing-function: cubic-bezier(0.175, .885, .32, 1);\n animation-timing-function: cubic-bezier(0.175, .885, .32, 1)\n }\n}\n\n.zoomOutUp {\n -webkit-animation-name: zoomOutUp;\n animation-name: zoomOutUp\n}",
"editionLink": "codepen.io",
"author": "Dan Eden",
"source": "Animate.css",
"sourceUrl": "http://daneden.github.io/animate.css/",
"issues": "https://github.com/daneden/animate.css/issues",
"license": "MIT",
"plainCssCode": "@keyframes zoomOutUp {\n 40% {\n opacity: 1;\n transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);\n animation-timing-function: cubic-bezier(0.55, .055, .675, .19)\n }\n 100% {\n opacity: 0;\n transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);\n transform-origin: center bottom;\n animation-timing-function: cubic-bezier(0.175, .885, .32, 1)\n }\n}\n\n.zoomOutUp {\n animation-name: zoomOutUp\n}"
}