Sequenced names

Asked

Viewed 32 times

0

I’m trying to assemble a javascript that sequenced a sentence inside my div, and after a few seconds it replaces the text with another pre-programmed, I’ve tried to do with for, timer and still can’t, instead of waiting for the first message to be written to write the second one he simply writes both at the same time.

var div = document.getElementById('log');
var texto = ['Hoje está um lindo dia!','Hoje não está um lindo dia!','Hoje o dia estar horrivel'];

function escrever(str, el) {
    var char = str.split('').reverse();
    var typer = setInterval(function () {
        if (!char.length) return clearInterval(typer);
        var next = char.pop();
        el.innerHTML += next;
    }, 100);
}
 setTimeout(escrever(texto[0], div),5000);
 setTimeout(escrever(texto[1], div),5000);
<div id="log"></div>

javascript html5

  • But you’re writing both at the same time, with the same timeout...

  • Ah, besides the fact that innerhtml will add the desired content, not replace the whole content, which seems to me to be its goal.

  • You put the timeout equal, Change for example setTimeout(write(text[0], div),1000); and in the second leaves the 5000, In 1 sec will execute 1 and after 4 seconds the other

1 answer

1


In setTimeout call the write inside the Function as in the example below and the first flame does not need timeout, Soon will call directly it, and after 3 seconds will call the second method:

var div = document.getElementById('log');
var texto = ['Hoje está um lindo dia!','Hoje não está um lindo dia!','Hoje o dia estar horrivel'];

function escrever(str, el) {
    var char = str.split('').reverse();
    var typer = setInterval(function () {
        if (!char.length) return clearInterval(typer);
        var next = char.pop();
        el.innerHTML += next;
    }, 100);
}
escrever(texto[0], div);
setTimeout(function(){ escrever(texto[1], div)}, 3000);
<div id="log"></div>

Browser other questions tagged javascript html5

You are not signed in. Login or sign up in order to post.