Create Fly-In Text in CSS
Here, we use CSS to create fly-in text (also referred to as "zoom-in text" and "slide-in text").
To create fly-in text, we use a basic CSS marquee but with a few modifications.
You can add replace
ease-out to make the text slide in gradually.
You could also use
ease, which would make it start gradually too. But in this case, we wouldn't notice any difference because it's hidden when it starts (because we use
In this example, I also explicitly set the height of the box in order to provide enough height to get the effect.