Jump to content
Christ-grace

Text appearance on a page as typed in right now and deleted again?

Recommended Posts

Hi 🙂 

I want text (quotes) to appear on a page as if it is typed in right now, and then deleted by the backspace key, followed by another text typed in. Like seen on https://iatl.co/ A leader is 

How is this called in tech language? Or can you find me a correspondent article on www.w3schools.com or another trustful source so I can implement it as html-code?

Happy about clear and competent help.

Greetings, Klaus

Share this post


Link to post
Share on other sites

There is no specific name for that, but you can do it in Javascript with a combination of string manipulation functions and timing functions.

In the programming world, most things are not done right out of the box and you often have to solve completely new problems on your own. This is why it is important to learn all the basics of programming which gives you the puzzle pieces you can fit together in different ways to solve any problem. This is not too difficult of a task to achieve once you are familiar with Javascript and the DOM.

Share this post


Link to post
Share on other sites

You would need to learn to separate each character within a string using split(), into an array. Then loop through each using incrementing index ref and setInterval() which would output each character as though someone was typing. The next stage would involve removing 1 character at a time from the string using slice(0,-1) again using a setInterval() as above.

If you want replace string with another? then you would need to store each string in an array.

required leaning

arrays

split();

slice();

setInterval();

clearInterval(),

document.getElementById()

if and else

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

×
×
  • Create New...