updated animation
This commit is contained in:
@@ -19,6 +19,7 @@
|
||||
h1 {
|
||||
position: relative;
|
||||
font-size: 2rem;
|
||||
animation: textShift 4s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.rocket {
|
||||
@@ -27,9 +28,15 @@
|
||||
}
|
||||
|
||||
@keyframes launch {
|
||||
0% { transform: translate(0, 0) rotate(0deg); opacity: 1; }
|
||||
70% { transform: translate(200px, -200px) rotate(0deg); opacity: 1; }
|
||||
100% { transform: translate(400px, -400px) rotate(0deg); opacity: 0; }
|
||||
0% { transform: translate(0, 0); opacity: 1; }
|
||||
70% { transform: translate(200px, -200px); opacity: 1; }
|
||||
100% { transform: translate(400px, -400px); opacity: 0; }
|
||||
}
|
||||
|
||||
@keyframes textShift {
|
||||
0% { transform: translateY(0); }
|
||||
70% { transform: translateY(30px); } /* faster drop while rocket rises */
|
||||
100% { transform: translateY(50px); } /* ends lower, exaggerating zoom effect */
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
Reference in New Issue
Block a user