this post was submitted on 23 Oct 2023
5 points (85.7% liked)

Web Development

3454 readers
1 users here now

Welcome to the web development community! This is a place to post, discuss, get help about, etc. anything related to web development

What is web development?

Web development is the process of creating websites or web applications

Rules/Guidelines

Related Communities

Wormhole

Some webdev blogsNot sure what to post in here? Want some web development related things to read?

Heres a couple blogs that have web development related content

CreditsIcon base by Delapouite under CC BY 3.0 with modifications to add a gradient

founded 2 years ago
MODERATORS
 

Hello,

I'm able to make texts fade in and out sequentially, like the following :

F
Fi
Fir
Firs
First
 irst
  rst
   st
    t
S
Se
Sec
Seco
Secon
Second
 econd
  cond
   ond
    nd
     d
T
Th
Thi
Thir
Third

Demo : https://jsfiddle.net/KaKi87/t3jm8yhx/2/

But I'd like to to make these fade in and out simultaneously, like the following :

F
Fi
Fir
Firs
First
S rst
Se st
Sec t
Seco
Secon
Second
T cond
Th ond
Thi nd
Thir d
Third

How to do that ?

Thanks !

you are viewing a single comment's thread
view the rest of the comments
[–] silas 1 points 1 year ago

Have you thought of splitting up the string into single letters and animating one letter at a time? The animation would be slightly different than the wipe animation you have going right now, but you wouldn’t have to worry about backgrounds anymore