Modify this code

Ask the community
,
1

Hi,
can anyone make this code work for 3 different texts (like build, create, show) with looping.
Currently it’s doing for one word/sentence only.

let i = 0 , interval = 100 , pause = 5000 ; const text = “My text is here. Yes, it’s here.” ; const runTyping = ( ms ) => setTimeout (() => showText (), ms ); function showText (){ $w ( “#text1” ). text = text . slice ( 0 , i ); i = ( i + 1 ) % ( text . length + 1 ); i > 0 ?runTyping ( interval ): runTyping ( pause );} $w . onReady (() => runTyping ( interval ));

2

Please format the code so it will be easy to read, and put it in code block.

3

Seems like a code from J.D.

let i = 0;
let interval = 100;
let pause = 5000;
const text = "My text is here. Yes, it's here.";

let runTyping = ms => setTimeout(() => showText(), ms);

console.log(runTyping());
    
    function showText() {
        //let text = "xxx";
        //text = text.slice(0, i);
        $w("#text1").text = text.slice(0, i);
        i = (i + 1) % (text.length + 1);
        i > 0 ? runTyping(interval) : runTyping(pause); 
    } 
    
    $w.onReady(() =>{runTyping(interval)});

J.D. your code-signature ? :grin:

@thestrokestudio

  1. Put a TEXT-ELEMENT onto your page.
  2. Add the formated CODE to your PAGE.
  3. Click —> PREVIEW!
  4. HAVE FUN!
4

Yes. I think it’s mine. thank you, Ninja.

So, thestrokesstudio , please explain what exactly you wish to do.
Do you want to show each sentence at once and loop between them?
Or maybe you want to have a typewriting effect for the combination of 3 sentences?

5

By the way, you could explain me this one…

let runTyping=ms=>setTimeout(()=>showText(), ms);

Do not see this often. I don’t get it.
For me this is a SYNTAX - ANOMALY :rofl:

6

It’s equivalent to:

function runTyping(ms){
return setTimeout(() => showText(), ms);
}
7

Let’s say I have three words: “Free Goods”, “Best Service” & “Discounted Price”.
I want these three words to come one after another while disappearing the previous word. Also, in a typewriter effect.

8 


let i =0, interval =100, pause =5000;
const text ="My text is here. Yes, it's here.";
construnTyping=(ms)=>setTimeout(()=>showText(), ms);

functionshowText(){$w("#text1").text = text.slice(0, i);   i =(i +1)%(text.length +1);
i >0? runTyping(interval):runTyping(pause);

}

$w.onReady(()=>runTyping(interval));
9 
let i = 0, j = 1;
let timeBetweenLetters = 150, timeBetweenSentences = 300;
let interval;
const texts = [
"Free Goods",
"Best Service",
"Discounted Price"
];
function runSentences(){
 interval = setInterval(showText,timeBetweenLetters)
}
    function showText() {
	const s = texts[i];
	const toShow =  s.substring(0, j);
	if(toShow.length === s.length){
		j = 1; 
		i = (i + 1) % texts.length;
		clearInterval(interval);
		setTimeout(runSentences, timeBetweenSentences)
	} else {
		j++;
	}
	$w('#text').text = toShow;
    } 
    $w.onReady(() => runSentences());
10

Yes, worked for me. Just a comma and a semicolon misplacement in the code.

Thank you, J.D., you are always helpful. :blush::blush: