HTML CSS examples for CSS Animation:Fly
Fly from top to bottom animation
<html> <head> <meta name="viewport" content="width=device-width"> <style> @keyframes rise {<!-- w w w. j a va2s . c o m--> 0% { transform: translate3d(0, 0, 0); } 100% { transform: translate3d(0, 1000px, 0); } } @supports (will-change: transform) { @keyframes rise { 0% { transform: translateY(0px); } 100% { transform: translateY(1000px); } } } div { width: 100px; height: 100px; background: #f00; animation: rise forwards 2s linear infinite; will-change: transform; } </style> </head> <body> <div class="foo" style="filter:blur(2px);"></div> </body> </html>